如何抑制之前声明的 CSS 规则?(背景色)

Question

在引导程序中，有一个css规则说

.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    background-color: #eee;
}

我想在不覆盖规则的情况下background-color禁止规则。
因为如果我将其添加到我的自定义样式中.css：

.nav>li>a:focus, .nav>li>a:hover {
    background-color: inherit;
}

。元素将具有白色背景。

所需的效果是抑制线路background-color: #eee;

保留类 .btn-primary 中定义的颜色。

HTML 看起来像这样

<ul class="nav nav-pills nav-stacked">
    <li role="presentation"><a class="btn btn-info" href="#">AAA</a></li>
    <li role="presentation"><a class="btn btn-primary" href="#">BBB</a></li>
</ul>

Answer 1

在 HTML 的head部分中，在bootstrap.css后包含custom.css文件，并在inherit后添加!important。

它应该可以解决问题。

.nav>li>a:focus, .nav>li>a:hover {
    background-color: inherit !important;
}

或者您可以使用unset：

.nav>li>a:focus, .nav>li>a:hover {
    background-color: unset !important;
}

https://developer.mozilla.org/en/docs/Web/CSS/unset