CSS规则层叠时的优先级算法

2008-04-08 10:38:32　来源:中国自学编程网　作者:佚名点击:

CSS 规则的优先级是Web前端开发人员必须理解的一个概念，我们常用的添加样式的方法有4种。

如果该规则是一条inline style，那么a = 1
如果该规则由selector指定，selector中出现的id selector的数量就是b的值
如果该规则由selector指定，selector中出现的属性selector（包括class selector）或者伪类selector的数量总和就是c的值
如果该规则由selector指定，selector中出现的元素selector或者是伪元素selector的数量总和就是d的值。
universal selector * 的特殊性值为0,0,0,0
官方网站提供了一些例子可以加深理解。

在根据特殊性值排序时，由于a的权重最高，因此首先比较a，在a相同的情况，在比较b，依次类推。因此不论b,c,d值有多大，inline style总是具有最高的特殊性。

如果根据以上特殊性排序后，有一条CSS规则的优先级高于其他所有竞争规则，那么算法结束，返回该最高优先级指定的值。如果有多条CSS规则具有最高优先级，那么它们将要继续竞争下去，算法将进入第4步。

4、比较CSS规则在文档中出现的顺序

出现在后的总是比出现在前的具有更高的优先级，因此出现在最后的那条语句将被作为该属性的值。

9 7 3 1 2 4 8 :