我可以折叠默认导航栏的链接,但我不想使用默认导航栏。我想要导航丸和药丸下的链接应该折叠为较小的屏幕。我的导航丸数据不会折叠为较小的屏幕。这是我的代码:
<div class = "row">
<nav class = "navbar" role = "navigation">
<div class = "container">
<div class = "navbar-header">
<button type = "button" class = "navbar-toggle" data-toggle = "collapse" data-target = "#collapse">
<span class = "sr-only">Toggle Navigation</span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
</button>
<a class = "navbar-brand inline" href = "#"><img src="img/logo.png" alt="" class = "img-responsive">
</a>
</div>
<div class = "collapse navbar-collapse" id = "collapse">
<ul class = "nav nav-pills">
<li><a href = "#">About</a></li>
<li><a href = "#">Services</a></li>
<li><a href = "#">Portfolio</a></li>
<li><a href = "#">Contact</a></li>
</ul>
</div>
</div>
</nav>
</div>
答案 0 :(得分:0)
在代码的开头,将其放入以下代码中:
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
该代码取代了这个:
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle Dropdown</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
`