css权重优先级的认知

从CSS代码存放位置看权重优先级:内嵌样式 > 内部样式表 > 外联样式表。其实这个基本可以忽视之,大部分情况下CSS代码都是使用外联样式表。

从样式选择器看权重优先级:important > 内嵌样式 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符。

  1. important的权重为1,0,0,0
  2. ID的权重为0,1,0,0
  3. 类的权重为0,0,1,0
  4. 标签的权重为0,0,0,1
  5. 伪类的权重为0,0,1,0
  6. 属性的权重为0,0,1,0
  7. 伪对象的权重为0,0,0,1
  8. 通配符的权重为0,0,0,0

最后,作为总结:

  1、  在考虑浏览器执行哪一个样式之前,先看样式有没有直接被选中。如果直接选中了,按照id数、类数、标签数来计算权重,谁最后的权重数值听谁的。如果数值一样,则按照渲染的先后顺序进行渲染。

  2、 如果没有直接被选中,那么就按照就近原则的方式执行,那条离目标元素进就应用哪条。

 

posted @ 2016-11-08 10:10  pguhxb  阅读(100)  评论(0)    收藏  举报