!important就是一个增加权重的方法,或者说是提高某个样式的优先级的作用
<div class="abc">我是abc
<div class="def">
我是def
</div>
</div>
样式是
.def{font-size:100px;}
.abc .def{font-size:20px;}
我们可以看到内嵌的def是按照第二个样式显示的,也就是20px ;
第二个样式的优先级较高,并且还处于下方,会覆盖上方的样式;
我们修改样式,添加 !important:
.def{font-size:100px !important;}
.abc .def{font-size:20px;}
可以看到,def的字体大小是按第一个样式来的,优先级因为添加 !important 而变得最大;