CSS标签权值的计算

*/by 司徒正美 All rights reserve*/
* {} /* a=0 b=0 c=0 d=0 -> specificity = 0,0,0,0 */
/* 通配符选择器权重为0,在IE中,它无法区分元素节点与注释节点 */
li {} /* a=0 b=0 c=0 d=1 -> specificity = 0,0,0,1 */
/* 标签选择器为1 */
li:first-line {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
/* 标签选择器与伪元素为1 */
ul li {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
/*这里存在后代选择器的概念,但计算权重时像它这样的关系选择器会被进一步肢解,当成两个标签选择器了。*/
ul ol+li {} /* a=0 b=0 c=0 d=3 -> specificity = 0,0,0,3 */
/* 无视后代选择器与相邻选择器,只看它里面的选择器的成分 */
h1 + *[rel=up]{} /* a=0 b=0 c=1 d=1 -> specificity = 0,0,1,1 */
/* 这个相邻选择器由标签选择器与属性选择器组成,属性选择器为10 */
ul ol li.red {} /* a=0 b=0 c=1 d=3 -> specificity = 0,0,1,3 */
/*无视后代选择器,3个标签与1个类选择器,类(className)在DOM中的位置比较显赫,
拥有专门的getElementByClassName,等级为c,合计得分13 */
li.red.level {} /* a=0 b=0 c=2 d=1 -> specificity = 0,0,2,1 */
/*两个类选择器与一个标签选择器,合计得分21 */
#x34y {} /* a=0 b=1 c=0 d=0 -> specificity = 0,1,0,0 */
/*getElementById,在页面上获得元素最快的方式,权重为b,得分100 */
style="" /* a=1 b=0 c=0 d=0 -> specificity = 1,0,0,0 */
/*行内样式,得分1000,会覆盖内部样式或外部样式的设置*/


更多资源可进原文链接获取。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值