码迷,mamicode.com
首页 > Web开发 > 详细

CSS选择器的权重关系

时间:2017-09-01 21:23:31      阅读:237      评论:0      收藏:0      [点我收藏+]

标签:class   style   生效   width   否则   元素选择器   通配符   属性   无法   

切记CSS选择器的权重关系,避免在页面中出现CSS样式无法生效的情况~

内嵌idclass元素
a b c d
内嵌 1 0 0 0
id 0 1 0 0
class、属性、伪类 0 0 1 0
元素、伪元素 0 0 0 1
通配符* 0      
!improtant(写在声明中,更改权重值) 最高      
  • a组数值只有把CSS写进style属性时才会为1,否则为0;
  • b组数值决定于ID选择器,有多少ID选择器,并会进行此数组值累加;
  • c组数值决定于类选择器,有多少类选择器,并会进行此数组值累加;
  • d组数值决定于元素选择器,有多少元素选择器,并会进行此数组值累加。

总结:

  • 权重不进位;
  • 内嵌权重级别最高,内联外联无权重关系,只存在先后顺序;
  • 权重相同时,后覆盖前。

CSS选择器的权重关系

标签:class   style   生效   width   否则   元素选择器   通配符   属性   无法   

原文地址:http://www.cnblogs.com/tortoises/p/7464935.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!