Question

Bootstrap导航条如何居中 两端对齐呢？ navbar-nav 和nav-justified

Bootstrap导航条如何居中 两端对齐呢？ navbar-nav 和nav-justified不能放一起啊 css样式加text-align：center也不行。求助

Answer 1

1. margin-left:auto;margin-right:auto;左右对齐。

2. margin:0 auto;居中对齐。

3. bootstrap总只要是含有container类名的div都是可以居中的无论在什么设备中。

导航条：

1. 导航条（navbar）和的导航（nav），就相差一个字，多了一个“条”字。其实在Bootstrap框架中他们还是明显的区别。

2. 在导航条(navbar)中有一个背景色（显示更突出）、而且导航条可以是纯链接（类似导航），也可以是表单，还有就是表单和导航一起结合等多种形式。在这一节中将一起探讨Bootstrap框架中导航条的使用。

3. 导航条和导航一样，在Bootstrap框架中是一个独立组件，所以你也可以根据自己的需求使用不同的版本：

4. LESS版本：对应的源文件navbar.less
   Sass版本：对应的源文件_navbar.scss
   

5. 编译后的版本：查看bootstrap.css文件第3642行～第4111行（注意这个所说的Bootstrap版本是3.1.1，其它版本位置是不一致的）。

Answer 2

//父元素
.collapse {
text-align: center;
}

//子元素
.navbar-nav {
float: none;
display: inline-block;
}

Answer 3

在导航栏这个div，class=“yi”制定宽度。在用一个div抱住.yi 设置.yi的margin：0 auto

即可。

Answer 4

可以用浮动属性，比如原来是：

<nav>

<ul class="pagination">

……

</ul>

</nav>

我们想让<ul>...</ul>这个导航条整体靠右，那么可以给<nav>新增几个属性：

<nav style="display: flex; justify-content: flex-end; ">

就可以靠右了。如果想深究这个flex属性，可以去阮一峰大神的blog看看：网页链接

Answer 5

bootstrap导航条中的nav元素默认是水平铺满的，不存在居中的问题，楼主说的是里面的ul.nav.navbar-nav菜单水平居中吧？
ul.nav.navbar-nav因浮动而不能直接用居中的样式，如果不清除浮动重新定位，可以用个变通的方法，把这个ul相对定位了，然后左边加上left，值设定一个百分数即可达到居中效果。代码如下：
position: relative;left: 20%;

是否成功了？请反馈一下^_^