今天用Bootstrap练习仿站时，发现目标站导航栏的菜单是居中排版方式，而Bootstrap貌似没有导航菜单居中的样式，着实折腾了很久，多次测试终于找到了解决方法。
第一种方法：给div和ul添加如下样式：（推荐学习：Bootstrap视频教程）
<div class="navbar-collapse collapse" style="text-align: center;"> <ul class="nav navbar-nav" style="display: inline-block;float: none;"> <li class=""> <a href="#">首页</a> </li> <li class=""> <a href="#">加入我们</a> </li> <li class=""> <a href="#">联系我们</a> </li> </ul></div>
第二种方法：
<div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li class=""> <a href="#">首页</a> </li> <li class=""> <a href="#">加入我们</a> </li> <li class=""> <a href="#">联系我们</a> </li> </ul></div>
添加如下样式：
.navbar-nav { float: none; text-align:center;}ul.nav.navbar-nav li { float:none; display: inline-block; margin: 0em;}
更多Bootstrap相关技术文章，请访问Bootstrap教程栏目进行学习！
以上就是bootstrap导航栏怎么居中的详细内容，更多请关注学步园其它相关文章！