我有一个 bootstrap.min.css
和下面的 div。
<div class='jumbotron'>
</div>
我正在使用自定义 css 文件覆盖此类。
.jumbotron{
background: green url(../img/city.jpg) no-repeat top left;
}
但是 jumbotron
类的内容没有改变。我知道 css 已正确包含,因为它适用于与 bootstrap 没有共享名称的其他 div。
我该如何解决这个问题?
最佳答案
在 Chrome 的开发者工具中查看元素(或者 Firefox 有类似的东西,不知道他们叫什么)。
右键单击 > 检查元素
现在看看右边的 CSS 样式。您在列表中的某处看到您的自定义样式了吗?您可能需要向下滚动一点。
如果它不在列表中,则意味着您的 CSS 文件未正确包含或元素名称拼写错误,因此您的样式未被应用。
如果它在列表中但被划掉了,这意味着 Bootstrap 的一种样式可能正在覆盖它。您可以使用 more specific selector 使您的样式优先于 bootstrap 的样式
关于html - 覆盖 Bootstrap 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23410185/