3

我有这个标记：

<div class='navbar'>
            <div class='navbar-inner'>
              <div class='container'>
                <a class='btn btn-navbar' data-target='.nav-collapse' data-toggle='collapse'>
                  <span class='icon-bar'></span>
                  <span class='icon-bar'></span>
                  <span class='icon-bar'></span>
                </a>
                <div class='nav-collapse'>
                  <ul class='nav'>
                    <li class='active'>
                      <a href='#'>Home</a>
                      <a href='#'>Option 2</a>
                      <a href='#'>Option 3</a>
                    </li>
                  </ul>
            </div>
          </div>
        </div>
      </div>

当屏幕已满时它呈现正常，但是当我折叠屏幕时，它不显示展开以显示选项的按钮。有什么我做的不对吗？知道为什么屏幕折叠后按钮不显示吗？

谢谢！

4

3 回答 3

8

正如 Andres 所说，您需要确保包含bootstrap-responsive.cs. 您还需要确保加载bootstrap.js文件，以便单击折叠按钮显示菜单列表。

此外，您应该将每个链接包装在其自己的<li>标签中，如下所示：

<ul class='nav'>
  <li class='active'><a href='#'>Home</a></li>    
  <li><a href='#'>Option 2</a></li>
  <li><a href='#'>Option 3</a></li> 
</ul>

否则你会得到一个看起来很奇怪的菜单。

于 2012-04-26T01:52:04.113 回答
3

您需要包含折叠插件 js 文件。像这样：http: //twitter.github.com/bootstrap/javascript.html

于 2012-04-25T21:02:04.233 回答
3

您需要包含bootstrap-responsive.css样式表才能使响应功能起作用。

http://getbootstrap.com/2.3.2/scaffolding.html#responsive

于 2012-04-25T22:09:16.690 回答