1

所以我有两个导航栏，第一个是倒置的，另一个是默认的。两者都使用折叠按钮功能并正常工作，但默认导航栏中的那个不显示。我的意思是，它就在那里，但它有点不可见：这是我的代码：

<div class="container main-container">
<nav class="navbar navbar-static-top navbar-inverse navigation" role="navigation">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".top-nav">
        <span class="sr-only">Toggle Navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>
    <div class="collapse navbar-collapse top-nav">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">News</a></li>
            <li><a href="#">About Us</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
    </div>
</nav>


...


<nav class="navbar navigation" role="navigation">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".main-nav">
            <span class="sr-only">Toggle Navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <div class="collapse navbar-collapse main-nav">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">News</a></li>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </div>
    </nav>
</div>

我的猜测是，第二个切换按钮以某种方式从第一个切换按钮中选择样式，并且没有“意识到”它应该使用默认颜色呈现。我将如何解决这个问题？这是一个显示行为的小提琴。

提前致谢。

4

1 回答 1

5

您navbar-default在第二个导航栏中缺少该类，您也应该navbar-header为切换按钮使用容器。

使用更新的标记查看此演示小提琴

于 2013-09-21T07:29:38.713 回答