Question

嗨，我在菜单栏中遇到了非常严重的问题。我正在使用bootstrap 3.菜单栏在缩小浏览器窗口大小时没有正确切换。我有9个带有png图标的菜单项。

我将我的代码放在这里

<div class="navbar-collapse collapse navbar-ex1-collapse">
            <!--<div class="collapse navbar-collapse">--><!--temporary added-->

            <ul class="nav navbar-nav">

              <li><a href="#"><span><img src="images/todoBtn.png"></span>&nbsp;&nbsp;ToDo</a></li>
              <li><a href="#"><span><img src="images/dineBtn.png"></span>&nbsp;&nbsp;Dining</a></li>
              <li><a href="#"><span><img src="images/shopBtn.png"></span>&nbsp;&nbsp;Shooping</a></li>
              <li><a href="#"><span><img src="images/todoBtn.png"></span>&nbsp;&nbsp;NightLife</a></li>
              <li><a href="#"><span><img src="images/fashionBtn.png"></span>&nbsp;&nbsp;Fashion</a></li>
              <li><a href="#"><span><img src="images/bodyBtn.png"></span>&nbsp;&nbsp;Body&Mind </a></li>
              <li><a href="#"><span><img src="images/eventBtn.png"></span>&nbsp;&nbsp;Events</a></li>
              <li><a href="#"><span><img src="images/exclusiveBtn.png"></span>&nbsp;&nbsp;Exclusive</a></li>
              <li><a href="#"><span><img src="images/tarvelBtn.png"></span>&nbsp;&nbsp;Travel</a></li>
        </ul>
        <!--</div>--><!--new div-->
        </div>

再次::菜单没有正确切换，因为我在menue中的内容增加了plz帮助我如何在bootsrap 3.0中管理。

PLZ帮助我这是对你们所有人的要求

感谢所有

Answer 1

它与你的内容增加没有任何关系，引导程序中的导航栏周围有<nav></nav>个标签，你错过了这个标签以及在较小视口上切换的按钮，这里是完整的导航栏你的菜单链接：

<nav class="navbar navbar-default" role="navigation">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <div class="navbar-collapse collapse navbar-ex1-collapse" id="navbar1">
            <!--<div class="collapse navbar-collapse">--><!--temporary added-->

            <ul class="nav navbar-nav">

              <li><a href="#"><span><img src="images/todoBtn.png"></span>&nbsp;&nbsp;ToDo</a></li>
              <li><a href="#"><span><img src="images/dineBtn.png"></span>&nbsp;&nbsp;Dining</a></li>
              <li><a href="#"><span><img src="images/shopBtn.png"></span>&nbsp;&nbsp;Shooping</a></li>
              <li><a href="#"><span><img src="images/todoBtn.png"></span>&nbsp;&nbsp;NightLife</a></li>
              <li><a href="#"><span><img src="images/fashionBtn.png"></span>&nbsp;&nbsp;Fashion</a></li>
              <li><a href="#"><span><img src="images/bodyBtn.png"></span>&nbsp;&nbsp;Body&Mind </a></li>
              <li><a href="#"><span><img src="images/eventBtn.png"></span>&nbsp;&nbsp;Events</a></li>
              <li><a href="#"><span><img src="images/exclusiveBtn.png"></span>&nbsp;&nbsp;Exclusive</a></li>
              <li><a href="#"><span><img src="images/tarvelBtn.png"></span>&nbsp;&nbsp;Travel</a></li>
        </ul>
        <!--</div>--><!--new div-->
   </div>
</nav>

<强> DEMO

Bootstrap 3.0响应式菜单栏切换问题..当增加菜单栏中的内容时

1 个答案: