课时88.权重问题(掌握)

2018-06-24 02:28:10来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

1.什么是优先级的权重?

作用:当多个选择器混合在以前使用时,我们可以通过计算权重来判断谁的优先级最高。

三个选择器都是直接选中p标签

2.权重问题的计算规则

2.1首先先计算选择器中有多少个id,id多的选择器优先级最高

2.2如果id的个数一样,那么再看类名的个数,类名个数多的优先级最高

.box1  .box2{

       color:blue;

}这个有两个类名

div .box2{

color:green;

}这里有一个类名

上面的优先级高,所以显示蓝色

2.3如果类名的个数一样,那么再看标签名称的个数,标签名称个数多的优先级最高。

#identity1 ul p{

         color:green;

}  这里有一个id,0个类,2个标签

#identity  ul  li p{

color:blue;

}一个id,0个类,3个标签

2.4如果id个数一样,类名个数也一样,标签名称个数也一样,那么就不会继续往下计算了,那么此时谁写再后面就听谁的,也就是说优先级如果一样,谁写再后面就听谁的。

#identity1  ul  .box2{

color:red;

}

.box   li     #identity2{

color:blue;

}

id个数一样,类的个数一样,标签个数一样,谁写再后面听谁的

注意点:

1.只有选择器是直接选中标签的才需要计算权重

为什么呢?来看下面的例子

.box2{

color:red;

}直接选中(一定会听直接的,所以一定是红色)

li{

color:blue;

}这个是继承来的。

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:css选择器

下一篇:课时100.背景图片和插入图片区别(掌握)