css - 将导航栏中的内容与 Bootstrap 中的位置中心对齐

Question

我试了很多，还是无法修复导航栏中间的内容。但可以将其固定在左侧或右侧。以下是我使用的代码。

<h4 class="navbar-text navbar-center">Mytitle </h4>

Answer 1

试试这个 -> JSFIDDLE DEMO

首先，您必须删除 Bootstrap 的通用类。

我们通过重置 float:none 选项来做到这一点!

然后我们使用 text-align:center 将内容居中。

CSS:

#example .navbar .nav,
#example .navbar .nav > li
{
    float:none; /*To remove the inbuilt float option*/
    display:inline-block;
}

#example .navbar-inner {
    text-align:center;/*To center this*/
}

.navbar .brand{
    float:none; /*To remove the inbuilt float option*/
}