Question

我正在尝试更改元素类，但它似乎不会影响它。

CSS文件加载在<head>中，但该类似乎没有任何效果。

我的 HTML ：

<div class="col-sm-3">.col-sm-3</div>
<div class="col-sm-6">.col-sm-6</div>
<div class="col-sm-3">.col-sm-3</div>

和我的 CSS ：

.col-sm-3 {
     background-color:black;
     height:500px;
}

Answer 1

这是因为您的引导程序文件是在css文件之后加载的，或者尝试给出

.col-sm-3{
     background-color:black !important ;
     height:500px !important;
}

但是给出!important是一个坏主意，因为它会覆盖引导类。因此，请尝试交换文件，确保在引导程序文件之后加载css。

Answer 2

尽量避免使用!important。

HTML

<div class="col-sm-3 black-bg">.col-sm-4</div>
<div class="col-sm-6 black-bg">.col-sm-4</div>
<div class="col-sm-3 black-bg">.col-sm-4</div>

CSS

.col-sm-3.black-bg{
     background-color:black;
     height:500px;
}

Answer 3

做一件事，窝住你的CSS，写这样的规则

html body .col-sm-3{
      background-color:black;
      height:500px;
}

这是覆盖css的正确方法