A. !important 无论出现在什么地方, 该样式都具有最高优先级. 含有!important的同级样式按照声明的顺序, 后出现的样式具有高优先级. (对于IE6有一些bug !important有时会被忽视, 对于JS控制的!important不同的浏览器也会有不同的表现, 具体请搜索css hack技巧)
B. 在元素内部的内联样式, 通过JS控制的内部样式由于相对CSS执行较晚, 即便顺序写在前面也比普通内联样式具有较高优先级.
C. 位于head标签内部的内部样式表, 通过链接得到的外部样式表. 这两位优先级相同, 相同选择器按照声明顺序, 后出现的样式具有高优先级.
无论选择器如何, 优先级都是 A > B > C .
C中不同的选择器优先级判断, 可以把某个样式看成[0,0,0]这样形式:
第一个数字为id选择器的总数 第二个数字为class选择器(含属性, 伪类)的总数 第三个数字为HTML元素(含伪元素)的总数
举例:
#header h1 - [1,0,1] .container #header h1 - [1,1,1] .container h1 - [0,1,1] div h1 - [0,0,2]
比较时按第一位比较大小, 大的优先级大, 相同比较第二位, 以此类推.
“*” 通用选择器具有最低优先级.