单击按钮时,导航栏不会解除折叠

时间:2015-11-27 11:01:31

标签: twitter-bootstrap

菜单没有解开,当我点击我的按钮时我无法找出原因:

<nav class="navbar navbar-default">
<div class="container-fluid"> 

<div class="navbar-header"> <!-- start of colllapsed navbar-->
  <button
    type="button"
    class="navbar-toggle collapsed"
    data-target="#main_navbar"
    aria-expanded="false"
  >open!</button>
</div> <!-- end of colllapsed navbar-->

<div class="collapse navbar-collapse" id="main_navbar"> <!-- start of uncolllapsed navbar-->

        <ul class="nav navbar-nav">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">My photos</a></li>
        </ul>
      </div> <!-- end of uncolllapsed navbar-->

    </nav>

    </div> <!-- end of container-->

是否与&#34; id&#34;?或者我在哪里弄错了?

1 个答案:

答案 0 :(得分:1)

这可能对您有所帮助

<强> HTML

<div class="navbar navbar-inverse ">
    <div class="container">
        <!-- Header -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span id="open">Open!</span>
            </button>
            <a class="navbar-brand" href="#">Bootstrap 3.0 Nav bar</a>
        </div>
        <!-- Navbar Links -->
        <div class="collapse navbar-collapse">
             <ul class="nav navbar-nav">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">My photos</a></li>
        </ul>
      </div> <!-- end of uncolllapsed navbar-->

        </div>
    </div>
</div>

小提琴here