CSS选择器的优先级

摘要: CSS选择器的优先级

前几天面试的时候，被问到一个CSS选择器优先级的问题。

题目大概是这样的：

对CSS选择器排序

ID选择器

类选择器

元素选择器

属性选择器

伪类选择器

伪对象选择器

通配符选择器

ID、类、标签这3个选择器的权重比较熟悉，其他几种选择器或多或少不是很确定。所以回来以后特地查了下官网资料，对CSS选择器优先级有了更深的认识。

CSS选择器通过a、b、c、d四个维度值来计算特征值。

选择器类型	纬度（a,b,c,d）
行内样式	1,0,0,0
ID选择器	0,1,0,0
类选择器、属性选择器、伪类选择器	0,0,1,0
元素选择器，伪元素选择器	0,0,0,1
通用元素选择器（*）	0,0,0,0

规则也很简单，同一纬度比较个数，个数多的优先级高，相同个数则比较下一级的个数，全部都相同，则后定义的优先级高。不过如果属性中使用了!important，则优先级提高到最高。所以，总结下

!important>行内>ID>类、属性、伪类>元素、伪元素>通配符

参考文档
http://yiminghe.iteye.com/blog/254094 http://www.cnblogs.com/fsjohnhuang/p/3940732.html http://www.w3.org/TR/CSS21/cascade.html#specificity http://www.cnblogs.com/aaronjs/p/3156809.html