【问题标题】:Bootstrap navbar-collapse not working properly when using nested navbars使用嵌套导航栏时,引导导航栏折叠无法正常工作
【发布时间】:2013-12-30 21:39:51
【问题描述】:

我正在使用 Bootstrap 3.0。当我尝试使用嵌套导航栏(另一个导航栏内的导航栏)时,子导航栏无法正常工作。当我单击子导航栏时,它不会在折叠视图(移动视图)中展开。请找到提到的导航栏

<li><a href="/">Dashboard</a>
</li>
<li> <a class="dropdown-toggle" data-toggle="dropdown">Employees<i class="icon-angle-down"></i></a> 
    <ul class="dropdown-menu">
        <li><a href="#">A</a>
        </li>
        <li><a href="#">B</a>
        </li>
        <li><a href="#">C</a>
        </li>
        <li><a href="#">D</a>
        </li>
        <li class="dropdown"> <a tabindex="-1" class="dropdown-toggle" data-toggle="dropdown">Reports<i class="glyphicon glyphicon-chevron-right pull-right"></i></a> 
            <ul class="dropdown-menu">
                <li><a href="#">1</a>
                </li>
                <li><a href="#">2</a>
                </li>
                <li><a href="#">3</a>
                </li>
                <li><a href="#">4</a>
                </li>
            </ul>
        </li>
        <li><a href="#">E</a>
        </li>
        <li><a href="#">F</a>
        </li>
        <li><a href="#">G</a>
        </li>
        <li><a href="#">H</a>
        </li>
    </ul>
</li>

提前致谢:)。

【问题讨论】:

标签: twitter-bootstrap-3 navbar


【解决方案1】:

下拉子菜单已在 Bootstrap 3 中删除。(请参阅: Bootstrap 3 dropdown sub menu missing)

所以,你必须这样做:http://bootply.com/103024

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px; *width: 180px;">
  <li><a href="#">Action</a></li>
  <li><a href="#">Another action</a></li>
  <li><a href="#">Something else here</a></li>
  <li class="divider"></li>
  <li class="dropdown-submenu">
    <a tabindex="-1" href="#" class="dropdown-toggle" data-toggle="dropdown">More options</a>
    <ul class="dropdown-menu">
      <li><a tabindex="-1" href="#">Second level</a></li>
      <li><a href="#">Second level</a></li>
      <li><a href="#">Second level</a></li>
    </ul>
  </li>
</ul>

【讨论】:

    猜你喜欢
    • 2016-12-06
    • 1970-01-01
    • 2016-08-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-07-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多