我使用的是Twitter的Bootstrap 3.0,无法终生了解如何在导航栏中定位品牌形象。
http://jsbin.com/efagoj/99/edit?html,output
<div class="navbar navbar-fixed-top" style="background-color: orange;">
<a class="btn btn-navbar pull-left">Left Text</a>
<a class="btn btn-navbar pull-left">Left Text 2</a>
<div class="navbar-inner">
<div class="container-fluid" style="text-align: center;">
<a class="brand" href="#" style="margin:0 auto; float: none;">
<img src="http://i.imgur.com/XlPrrVD.png" style="height:30px;">
</a>
</div>
</div>
<a class="btn btn-navbar pull-right">Right Text</a>
</div>
我希望品牌形象无论如何都可以保持居中地位-即使双方都有多个联系。
最佳答案
我认为这种解决方案可能比将其从页面流程中删除更为可接受。因此,如果您有两个浮动容器,一个在左侧,一个在右侧,两个容器的宽度均相等,则应正确放置中心的div
以便居中。
http://jsbin.com/efagoj/116/edit
但是,这需要页面上足够的宽度才能正确显示。另外,如果要更改导航栏,则必须确保左右两侧的宽度始终相同...因此,@ media查询的绝对位置可能对您更好。