权重

我们在使用CSS对网页元素定义样式时经常会遇到这种情况:要对一般元素应用一般样式,然后在更特殊的元素上覆盖它们。那么我们怎么样来保证我们所新定义的元素样式能覆盖目标元素上原有的样式呢?

在CSS中,会根据选择器的特殊性来决定所定义的样式规则的次序,具有更特殊选择器的规则优先于具有一般选择器的规则,如果两个规则的特殊性相同,那么后定义的规则优先。

那么,又怎么来计算选择器的特殊性呢?

我们把特殊性分为4个等级,每个等级代表一类选择器,每个等级的值为其所代表的选择器的个数乘以这一等级的权值,最后把所有等级的值相加得出选择器的特殊值。

4个等级的定义如下:

  1. 第一等:代表内联样式,如: style=””,权值为1,0,0,0。
  2. 第二等:代表ID选择器,如:#content,权值为0,1,0,0。
  3. 第三等:代表类,伪类和属性选择器,如.content,权值为0,0,1,0。
  4. 第四等:代表类型选择器和伪元素选择器,如div p,权值为0,0,0,1。
  5. 注意:通用选择器(*)的权值为0。
  6. !important声明的样式优先级最高。
  7. 继承得到的样式的优先级最低。

posted on 2017-07-02 21:34  修正版vhr  阅读(133)  评论(0编辑  收藏  举报

导航