选择器的权重

497 阅读1分钟

权重是什么?

如果一个标签里面又有类又有id选择器的话,标签的渲染会听谁的话呢?

根据渲染结果我们可以得出,它听了id选择器的话。
因为选择器之间的权重不一样,如果选择器之间的css产生冲突,那么权重越大的可以覆盖掉权重小的
但是由于css有三种不同的引入形式(行内,内部,外部)所以根据不同的引入形式,权重也不一样:行内的权重最重,内部的权重次之,写在外部css文件里面的样式权重最低
记住下面的表格(以下的数字都是二进制数):

内联样式的权重是1000
id选择器的样式0100
类和伪类选择器0010
标签选择器0001
通配符选择器("*")0000

还有个比较异类的标识符叫!important,这个标识符的作用就是帮助选择器提升优先级

结果当然是内联样式的权重更重,元素被渲染成红色,但是如果我们给它提升权益呢

就变成蓝色了!所以权重最重的是通过!important提高权益的css样式
!important关键字有一定的兼容性问题,在ie7以上的浏览器上都没有问题,ie6可能会失去效果