CSS中层叠和特殊性

当同时存在两条甚至多条规则同时选择一个元素的时候,CSS就需要使用层叠的机制来处理这种冲突。

1. 层叠机制的原理

为规则赋予不同的重要程度,层叠机制的重要性级别从高到低如下所示:

  • 标记为!important的用户样式
  • 标记为!important的作者样式
  • 作者样式 (网站开发者所写的样式)
  • 用户样式 (用户通过浏览器的设置选项,为网页应用自己的样式)
  • 浏览器(或者用户代码)的默认样式

在此基础上,规则再按选择符的特殊性排序。

2. 特殊性

为了量化规则的特殊,每条规则都对应着一个数值。这样,一条规则的特殊性就表示为其每个选择符的累加数值。累加是基于位置累加,以保证累加值不大于等于1

任何选择符的特殊性都对应于如下4个级别,a、b、c、d:

  • 行内样式,a为1
  • b等于ID选择符的数目
  • c等于类(class)选择符、伪类选择符及属性选择符的数目
  • d等于类型(type)选择符和伪元素选择符的数目

你可能感兴趣的:(CSS中层叠和特殊性)