所以我有两个导航栏，第一个是倒置的，另一个是默认的。两者都使用折叠按钮功能并正常工作，但默认导航栏中的那个没有显示。我的意思是，它就在那里，但它有点看不见：这是我的代码：
<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>
我的猜测是第二个切换按钮以某种方式从fisrt中选择样式并且没有“意识到”它应该使用默认颜色进行渲染。我该如何解决这个问题？这是一个fiddle showing the behavior。
提前致谢。