使用Bootstrap导航栏作为不折叠的固定顶部栏
我正在尝试做一件简单的事情：顶部栏（如固定的导航栏），左侧有一个品牌名称，右侧有2个图标。 我正在开发移动设备，因此我不希望它在小屏幕上进行更改（像缺省情况下，导航栏一样会崩溃）。
我对Bootstrap比较陌生，所以我想我做错了什么。
为了防止崩溃，我把所有内容放在navbar-header div中。 我创建了一个<span class="pull-right">将图标放到右侧，但我无法让它们正确呈现。
（我怀疑这是否重要，但我使用的是Bootstrap 3.0.x.）
这是我目前有：http://jsfiddle.net/rd73tecL/2/
尝试使用以下CSS来禁用折叠效果（如下所示：Bootstrap 3 - 禁用导航栏折叠）：
.navbar-collapse.collapse {
display: block !important;
}
.navbar-nav>li, .navbar-nav {
float: left !important;
}
.navbar-nav.navbar-right:last-child {
margin-right: -15px !important;
}
.navbar-right {
float: right !important;
}
我不确定您右边的2个图标的含义：徽标的右侧或导航栏的右侧？ 如果是后一种情况，可以将导航栏链接放入div中，并添加右拉类将其放在导航栏的右侧。 您还需要添加display: inline-block !important; 到你的导航栏标志的CSS，如JSfiddle所示
希望有所帮助。
尝试使用此代码：
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">Fibe</a>
<span class="navbar-right pull-right">
<ul class="navbar-nav nav">
<li class="navbar-link"><span class="glyphicon glyphicon-search"></span></li>
<li class="navbar-link"><span class="glyphicon glyphicon-star"></span></li>
</ul>
</span>
</div>
</div>
</nav>
刚刚修改
<span class="navbar-right"> with <span class="navbar-right pull-right">
希望这可以帮助。
链接地址: http://www.djcxy.com/p/69009.html上一篇: Use Bootstrap navbar as a fixed top bar that doesn't collapse