如何扩展引导类

【问题标题】：How extend bootstrap classes如何扩展引导类
【发布时间】：2013-06-25 06:27:46
【问题描述】：

我正在使用 Bootstrap Twitter 做我的第一步，并且需要扩展组件。例如，我想更改导航栏背景，但不更改原始 css 文件。

我尝试使用新背景创建一个新类.test：

.test{
    background-color: red !important;
}

我在 hmtl 中将其调用为：

 <div class="navbar navbar-fixed-top test">

但是，它不起作用。怎么会这样？

【问题讨论】：

【解决方案1】：

有几种方法可以自定义/扩展 Bootstrap 类，这些都在这里讨论：Twitter Bootstrap Customization Best Practices

如果您打算使用自己的自定义 CSS 覆盖 boostrap 样式，则应避免使用 !important，因为这通常是一种不好的做法。

对于navbar，具有背景颜色的元素是navbar-inner，因此您需要像这样覆盖：

.test .navbar-inner{
    background-color: red;
}

自定义导航栏示例：http://bootply.com/61032

【讨论】：