Twitter bootstrap 引导-两个导航条未正确折叠

你好，引导用户

我想知道你是否能帮我。请看屏幕截图

不幸的是，当我在菜单中添加一些额外的项目时，菜单不会崩溃，因为应该看到上面的链接这个问题会影响所有设备/浏览器

有人知道问题出在哪里吗

请参阅下面的我的代码，抱歉格式化 切换导航 友好的名字 家 全体的 第2组 链接1 链接2 链接3 第2组 链接4 链接5 链接6 第3组 链接7 第4组 链接8 42 链接9220 链接10

亲切问候

pi4r0n

---

我们明确地在

内容泛滥 由于引导程序不知道navbar中的内容需要多少空间，因此在将内容包装到第二行时可能会遇到问题。要解决此问题，您可以：

减少导航栏项目的数量或宽度。 使用响应实用程序类以特定屏幕大小隐藏某些导航栏项目。 更改导航栏在折叠模式和水平模式之间切换的点。自定义@grid float breakpoint变量或添加您自己的媒体查询。

---

HTML中几乎没有PHP回声。介意你发布整个代码吗？您可以使用Pastebin或任何类似的服务来执行此操作。这可能会导致issues@Nikola对不起，我忘了移除回声；但这不是问题。我从Bootstrap网站上取了这个例子，从我所看到的情况来看，这个问题也存在，所以这可能是一个我无法解决的框架问题：不幸的是，你的例子和我的例子遇到了同样的问题。看看你的演示，试着慢慢调整UI的宽度。看，哦，我现在明白了。那么，试着实现如下内容：@Nokola上述解决方案并不真正适合移动/平板电脑：

  <ul class='nav navbar-nav navbar-right'>
  <li><a href='../navbar-fixed-top/'><span class='glyphicon glyphicon-info-sign'></span> Help</a></li>
  <li class='dropdown'>
    <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='glyphicon glyphicon-wrench'></span> Settings <b class='caret'></b></a>
    <ul class='dropdown-menu'>
      <li><a href='#'><span class='glyphicon glyphicon-envelope'></span> Notification</a></li>
      <li><a href='#'><span class='glyphicon glyphicon-tower'></span> Members</a></li>
      <li><a href='#'><span class='glyphicon glyphicon-plus'></span> New User</a></li>';
    </ul>
  </li>
  <li class='dropdown'>
    <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='glyphicon glyphicon-user'></span> Administrator<b class='caret'></b></a>
    <ul class='dropdown-menu'>
        <li><a href='#'><span class='glyphicon glyphicon-tower'></span> Profile</a></li>';
        <li><a href='#'><span class='glyphicon glyphicon-compressed'></span> Change Password</a></li>';
        <li class='divider'></li><li><a href='logout.php'><span class='glyphicon glyphicon-log-in'></span> Log Out</a></li>';
     </ul>
  </li>
  </ul>
</div>

<div class="container">
    <div class="navbar navbar-default">
        <div class="navbar-header"> <a class="navbar-brand" href="#">Bootstrap 3</a>

        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">General <b class="caret"></b></a>

                    <ul class="dropdown-menu">
                        <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>
                </li>
                <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Orders <b class="caret"></b></a>

                    <ul class="dropdown-menu">
                        <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>
                </li>
                <li><a href="http://getbootstrap.com/css">Time Table</a>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li class="active"><a href="http://getbootstrap.com/customize">Customize</a></li>
                <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Settings <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <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>
                </li>
                <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Administrator <b class="caret"></b></a>

                    <ul class="dropdown-menu">
                        <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>
                </li>

            </ul>
        </div>
    </div>
    <div class="jumbotron">
         <h1>Twitter Bootstrap 3.0</h1>
    </div>
</div>