权重即重要性,重要的优先级就比较大。
在css中,权重优先判断:
行内样式>内部样式>外部样式。
在同一样式下在判断选择器权重。如下:
通用选择器(*)<元素(标签)选择器<类选择器<属性选择器<伪类<ID选择器。
!important独立于css权重之外,效果为强制应用某样式。
之前遇到一个问题,
伪类hover字体颜色改变,js操作dom也改变了字体的颜色,导致覆盖了hover的效果。
原因是js操作dom是直接在行内样式中操作,权重大于外部样式的伪类,导致hover失效,
解决办法就是加上!important,如:
a:hover{color:red !important}
强制将hover权重提至最大,解决问题