前端小笔记--css权重

CSS权重总结:

标签值 权重值
!important infinity 正无穷
行间样式 1000
id选择器 100
class选择器,属性选择器,伪类选择器 10
标签选择器,伪元素选择器 1
通配符选择器 0

css选择规则的权重值不同,权重值高的优先

当权重值相同时,后定义的规则优先(后来先到)

!important 标记的属性权重值无视没用 !important 指定的一切情况,
多次指定则相互抵消。

通过学习发现,权重值并不是简单的根据上面表格的数字总和来进行比较的,
而是从高到低逐级比较等级位上的权重值:

第一等级:1,0,0,0 (内联样式)
第二等级:0,1,0,0 (id选择器)
第三等级:0,0,1,0 (类选择器/属性选择器/伪类选择器)
第四等级:0,0,0,1 (元素选择器/伪元素选择器)

也就是说低等级的选择器就算个数再多也不会超过高等级选择器的优先级。
按照之前的方法,只要低等级选择器够多,它的优先级就有可能超过高等级选择器。

你可能感兴趣的:(小白学习笔记)