Bootstrap 3 RC1 - 更改导航栏颜色答案

【问题标题】：Bootstrap 3 RC1 - Change navbar colorBootstrap 3 RC1 - 更改导航栏颜色
【发布时间】：2015-11-24 04:34:45
【问题描述】：

我想将Bootstrap 3 导航栏颜色从默认灰色更改为#5e00ff。 Bootstrap 的自定义部分尚不可用 - 如何手动进行？

【问题讨论】：

【解决方案1】：

在您的 CSS 中，添加以下内容：

.navbar
{
    background-color: #5e00ff;
}

希望对您有所帮助。

【讨论】：

【解决方案2】：

在你的 CSS 文件中添加

.navbar {
    background-color: #5e00ff !important;
}

这将覆盖引导 CSS 文件。我不熟悉引导文件中导航栏的 CSS 的位置，但更简单的方法是找到该文件并更改分配给它的背景颜色。

【讨论】：

【解决方案3】：

作为补充答案，如果您正在从源代码构建引导程序并且希望在不进行任何其他 css 修改的情况下完成它，请导航到 less 文件夹并打开 variables.less 文件。

在第 227 行，更改：

@navbar-bg: #eee;

到这里：

@navbar-bg: #5e00ff;

然后构建。 :)

【讨论】：

我建议不要修改包含的 .less 文件。您最好在顶部创建一个新的mysite.less、@import bootstrap，然后根据需要覆盖变量。这意味着对 Bootstrap 3 的任何更新——其中会有很多更新，尤其是。鉴于这只是一个候选版本——您可以将其拉下，而无需重新编写源文件。请注意，您应该使用 Twitter 的 RECESS 工具将 .less 文件编译为单个 CSS 文件。