四种 CSS 选择器优先级详细介绍
CSS优先级包含四个级别:文内选择符、ID 选择符、Class 选择符、元素选择符,以及各级别出现的次数。根据这四个级别出现的次数计算得到 CSS 的优先级。
对优先级的读法,应该是以组来分,这个组之间相互独立,从左到右进行对比。它们成组出现,以逗号分隔。如下表
行内样式 | ID选择器 | CLASS选择器 | 标签选择器 |
1,0,0,0 | 0,1,0,0 | 0,0,1,0 | 0,0,0,1 |
下面是一些常见的选择器,我们一起来分析他们的优先级:
样式 | 分组情况 | 得分 |
#head | 0,1,0,0 | 0100 |
.nav a | 0,0,1,1 | 0011 |
#head .ad | 0,1,1,0 | 0110 |
说明:
- 得分最高,优先级最大!
- 得分相同,后面的属性样式会覆盖前面的属性样式!
!important
声明的样式优先级最高,如果冲突再进行计算。- 继承得到的样式的优先级最低。
以上是 四种 CSS 选择器优先级详细介绍 的全部内容, 来源链接: utcz.com/p/231769.html