Css 推特引导：移动设备上的堆叠导航

我正在尝试在我的twitter boostrap模板中有一个非常简单的导航栏，它可以简单地在手机上垂直堆叠菜单项（点击时会显示孩子们）。由于我是新手（Bootstrap）（我习惯了基金会3），所以我使用BootsWist表来启动这个站点的开发。我在标题中包含了所有可用的javascript插件和jquery

到目前为止，我对这些文档感到非常困惑，如果您能帮助我修改当前的菜单，使其在手机上正常工作，我将不胜感激。谢谢大家!

<div class="navbar">
  <div class="navbar-inner">
    <ul class="nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
    </ul>
  </div>
</div>

要获得值collapse，您需要将

.nav collapse

div添加到

导航栏内部

，并将其设置为可折叠div导航部分的目标

<div class="navbar-inner">
<div class="container">
    <a data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar">
                    <!--These are to make the button look fancy-->
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </a>

    <div class="nav-collapse collapse">
        <ul class="nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
        </ul>
    </div>
</div>
</div>

---

Bootstrap文档

中的更多信息作为我试图完成的示例，并且已经在基金会3中完成了，请访问澄清，您想做类似于“打印、Navar、按钮、窗体……”的CyBOG菜单吗？