如何从Bootstrap获取手机下拉菜单？

Question

如果你用手机打开bootstrap的主网站，你会注意到右上角有一个向下滑动的菜单。

这是导航栏的一部分。

我在哪里可以找到这个下拉菜单插件？它不在主站点上。

Answer 1

这是响应式导航栏--在手机上显示的变体。要找到它并查看它的用法，请阅读Carlo的评论或转到此处：

http://getbootstrap.com/components/#navbar-default

Answer 2

请参阅此示例：http://twitter.github.com/bootstrap/examples/fluid.html

记住要添加：

<script src="../assets/js/bootstrap-dropdown.js"></script>

和css：

<link href="../assets/css/bootstrap.css" rel="stylesheet">
<link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">

以下是代码示例：

<div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container-fluid">
          <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
          </button>
          <a class="brand" href="#">Project name</a>
          <div class="nav-collapse collapse">
            <p class="navbar-text pull-right">
              Logged in as <a href="#" class="navbar-link">Username</a>
            </p>
            <ul class="nav">
              <li class="active"><a href="#">Home</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>

Answer 3

我相信这是响应式css bootstrap-responsive.css的结果。

由于设备宽度检测的不同，它在移动设备上显示不同。