请问使用bootstrap如何制作这样的导航菜单?


图片描述

我看了官网,然后查看他的源代码:


 <div class="row">
      <div class="span3 bs-docs-sidebar">
        <ul class="nav nav-list bs-docs-sidenav">
          <li><a href="#dropdowns"><i class="icon-chevron-right"></i> 下拉菜单</a></li>
          <li><a href="#buttonGroups"><i class="icon-chevron-right"></i> 按钮组</a></li>
          <li><a href="#buttonDropdowns"><i class="icon-chevron-right"></i> 按钮下拉菜单</a></li>
          <li><a href="#navs"><i class="icon-chevron-right"></i> 导航</a></li>
          <li><a href="#navbar"><i class="icon-chevron-right"></i> 导航条</a></li>
          <li><a href="#breadcrumbs"><i class="icon-chevron-right"></i> 面包屑</a></li>
          <li><a href="#pagination"><i class="icon-chevron-right"></i> 分页</a></li>
          <li><a href="#labels-badges"><i class="icon-chevron-right"></i> 标签与徽章</a></li>
          <li><a href="#typography"><i class="icon-chevron-right"></i> 排版</a></li>
          <li><a href="#thumbnails"><i class="icon-chevron-right"></i> 缩略图</a></li>
          <li><a href="#alerts"><i class="icon-chevron-right"></i> 警告框</a></li>
          <li><a href="#progress"><i class="icon-chevron-right"></i> 进度条</a></li>
          <li><a href="#media"><i class="icon-chevron-right"></i> 媒体对象</a></li>
          <li><a href="#misc"><i class="icon-chevron-right"></i> Misc</a></li>
        </ul>
      </div>

官方使用的这些类,都在他的手册都没有。。。
是不是官方手册提共的api不全面。因为我写代码有一个怪毛病,就是喜欢查找手册有没有。。
好像官方没有nav-list bs-docs-sidenav这两个类吧。。还是我看漏了??

css bootstrap

apoloe 10 years, 2 months ago

从截图来看你使用的是BootStrap2,这个东西叫 附加导航

小逗逼嘎嘎嘎 answered 10 years, 2 months ago

两个方法:
1.直接看源码...
2.借助浏览器,如果是chrome的话,按F12,在 element 那个tab的右边有,仔细看看(学会用工具)

还有.. 那不叫什么API.. 只是简单的教程... nav-list 在bootstrap.css;
至于 bs-docs-sidenav 这个在bootstrap 的 什么 Bootstrap's documentation styles

奶油马铃薯 answered 10 years, 2 months ago

Your Answer