我的主要样式表是这个:
<link href="css/waldbrand.css" rel="stylesheet" type="text/css">
但是每当我在我的 HTML 文件中添加一个新的样式表时，我的主要 CSS 就会被覆盖。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
如何在不覆盖主 CSS 的情况下将 Bootsttrap 样式表添加到我的 HTML 中？
最佳答案
您需要了解 CSS 优先级，浏览器按以下顺序评估和应用 CSS 规则:
- 内联 css(html 样式属性)覆盖样式标签中的 css 规则 和 CSS 文件。
更具体的选择器优先于不太具体的选择器。
代码中后面出现的规则会覆盖前面的规则，如果两者都存在 具有相同的特异性。
- 带有 !important 的 css 规则始终优先。
根据这个，你应该最后加载你的自定义 css，所以它会覆盖 bootstrap 中的类似样式。还尝试为特定元素创建自定义 CSS。最后，使用 !important 是不值得推荐的，因为它是不好的做法。
如需进一步引用，我建议查看 MDN documentation .
关于html - 如何将另一个样式表与 Bootstrap 一起使用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54892349/