override all other styles by using important - zilongxuan001/LearnFreecode GitHub Wiki
!important > 行内样式 > id样式 > class下边样式 > class上边样式 > body
为什么要覆盖CSS样式？
这是因为很多情况下，你会使用CSS库。CSS库会覆盖你的CSS样式。当你确定一个元素需要一个特殊的样 时，就需要覆盖CSS库的样式。
在你的CSS中加入!important，就能够覆盖所有样式。
<style>
body {
background-color: black;
font-family: Monospace;
color: green;
}
#orange-text {
color: orange;
}
.pink-text {
color: pink !important;
}
.blue-text {
color: blue;
}
</style>
<h1 id="orange-text" class="pink-text blue-text" style="color: white">Hello World!</h1>
在class.pink-text中加入了 color: pink !important;，那么h1颜色就会变成粉色。
在浏览器中显示如下
属性选择器的优先级和class选择器一样，如果属性选择器在class最下面，则优先选择属性选择器；如果属性选择器在class上面，则优先选择最下面的class选择器。
Basic CSS: Override All Other Styles by using Important | Learn freeCodeCamp