引导导航栏均匀间距答案

【问题标题】：bootstrap navbar even spacing引导导航栏均匀间距
【发布时间】：2015-05-31 16:41:54
【问题描述】：

我不知道如何在导航栏中设置均匀间距：

Articles 和 User Profile 之间的差距比 User Profile 和 Admin 之间的差距更大。

Admin 和 DB 之间的差距比 User Profile 和 Admin 之间的差距更大。

我的代码是：

<li class="blog-nav-item">
        <a class="blog-nav-item" href="#" class="blog-nav-item active" data-toggle="dropdown" role="button" aria-expanded="false">Articles<span class="caret"></span></a>
        <ul class="dropdown-menu" role="menu">
            <li><a href="/articles/create">All</a></li>
            <li><a href="/articles/create">Create New</a></li>
        </ul>
    </li>   

<a class="blog-nav-item" href="/accounts/profil/">User Profil</a></li>
<a class="blog-nav-item" href="/admin/">Admin</a></li>

<li class="blog-nav-item">
    <a href="#" class="blog-nav-item" data-toggle="dropdown" role="button" aria-expanded="false">DB<span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
        <li><a href="/articles/api/article/?format=json">DB: JSON</a></li>
        <li><a href="/articles/api/article/?format=xml">DB: XML</a></li>
    </ul>
</li>

【问题讨论】：

标签： django twitter-bootstrap navbar

【解决方案1】：

这是因为默认情况下，简单列表元素和下拉菜单的边距间距不同。

通过以下方式覆盖设置：

.blog-nav-item > a{
    margin-right:10px;
}
.blog-nav-item > .dropdown-menu{
    margin-right:10px;
}

将这些类添加到 css 中会有所帮助

【讨论】：

我不知道应该把它放在哪里：在 blog.css 或 bootstrap.min.css 中？我相信我应该把它放在 blog.css 中，我已经尝试过了，但它并没有改变任何东西。
您需要在文件的头部包含 blog.css。添加 text-align: center; 也是有意义的。到 .blog-nav-item 类。
好的，我创建了一个新的 css 文件：test.css，我在其中放置了您的代码。我也将它包含在我的 index.html 文件中。如果我修改第二个像素值，则没有任何变化。如果我修改第一个像素值，我可以看到变化。虽然，这种变化使文章和用户配置文件之间的差距更大或更小，并且取决于价值（价值 -5px 更小，价值 +15px 更宽）。我认为改变它不是正确的方法。