美文网首页
学习Bootstrap3组件之导航

学习Bootstrap3组件之导航

作者: ldhonline | 来源:发表于2018-09-23 02:05 被阅读0次
image.png

一、选项卡

boostrap 提供了两种样式，一种是经典的选项卡，一种是胶囊式的。它默认没有提供js支持，不能切换，必须手动添加。

  • 标签组合结构为 ul.nav>li>a。
  • 胶囊式nav-pills，它还可以变换为堆叠排版 stacked。
  • 经典式nav-tabs。
  • 两种都可以转换为拉伸均分的排版 .nav-justified。
  • 子项有两个样式，一个是选中的 active, 一个是禁用的disabled。
  • 可以添加下拉菜单，这个时候 <li>添加 .dropdown 做为容器, <a>添加 data-toggle="dropdown" 做为触发器，再添加 span.caret 箭头，下面添加 dropdown-menu即可。
image.png

二、导航条

导航条是一个复杂的组件，它有两种视图，一种是小屏的logo加菜单按钮

相关文章

网友评论

      本文标题：学习Bootstrap3组件之导航

      本文链接：https://www.haomeiwen.com/subject/ltdfoftx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|学习Bootstrap3组件之导航|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！