微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

javascript – Twitter Bootstrap 3导航栏切换按钮,带有不同的图标

分类：HTML作者：编程之家

通过使用Twitter Bootstrap 3,我想为移动设备创建一个额外的导航栏.

在导航栏中,我将在栏的每一侧放置2个切换按钮.左按钮将具有经典的“三条形”图标,右按钮将具有不同的图标.我想要右键在里面有“.glyphicon .glyphicon-comment”.如果用户单击该按钮,它还将切换第二个菜单.我可以切换菜单,但图标无法更改？

我无法在右切换按钮内放置任何其他图标？ (我还需要在导航栏中居中的“一些链接”文本)

小提琴：http://jsfiddle.net/mavent/WPfe3/2/

最佳答案
SEE THE DEMO HERE

你忘记在你的jsfiddle演示中添加bootstrap-glyphicons.css.
然后替换它

同

然后,要将链接置于中心,您需要从标记中删除类navbar-brand.然后用div包装你的链接,然后应用text-align：center和一些填充来获取中心的链接.

原文地址：https://www.jb51.cc/html/426823.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

Vue+elementUI 自定义动态数据菜单导航组件实现展开收缩+路由跳转router-view渲染数据 路由跳转到同一个页面带参数ID 自动刷新数据
准备:导入ElementUI 看官网教程 数据准备:JSON数据转换成树状 参考文章: JS实现 JSON扁平数据转换树状数据 后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name: '', level: 0}, {id:2 , parentId: 0
vue阻止冒泡事件 阻止点击事件的执行 结合div和组件阻止点击事件
vue阻止冒泡事件 阻止点击事件的执行 <div @click="alerA1()" > <div @click.stop="alerA2()><div> </div> 这样就可以实现阻止点击 点击 alerA2
自用代码css获取任意网址的/favicon.ico的方法教程
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用这种办法获取 如果有好的方法望评论告知 谢谢 <img :ng-src="'http://'+list.url+'/favicon.ico'" :src="'ht
JS实现 JSON扁平数据转换树状数据
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name: '', level: 0}, {id:2 , parentId: 0, name: '', level: 0}, {id:3 , parentId: 2, name: '&
JAVA下载文件防重复点击,防止多次下载请求，Cookie方式快速简单集成教程
JAVA下载文件防重复点击,防止多次下载请求，Cookie方式快速简单集成教程 JS文件在最下面: 引入 <script src="${path}/js/jquery-2.0.3.min.js"></script> <script src=&quot
Mip是什么意思以及作用有哪些
Mip是什么意思以及作用有哪些
怎么测试Mip页面运行情况
怎么测试Mip页面运行情况
MIP安装的具体步骤有哪些
MIP安装的具体步骤有哪些
HTML添加超链接、锚点的方法及作用详解（附视频）
HTML添加超链接、锚点的方法及作用详解（附视频）
MIP的规则有哪些
MIP的规则有哪些
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLPHPreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-boot