优先权之权重会叠加

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style type="text/css">
 7         /* .father{
 8             color:pink;
 9             font-size:60px;
10         }
11         p{
12             color:#885;
13             font-size:100px;
14         }
15         #box{
16             color:blue;
17             font-size:80px;
18         } */
19         p{
20             font-size:30px;
21             color:red;
22         }
23         .son{
24             font-size:60px;
25             color:blue;
26         }
27         p.son{
28             font-size:120px;
29             color:pink;
30         }
31         .father .son{
32             font-size:200px;
33             color:#760943;
34         }
35          .father #baby{
36             font-size:80px;
37             color:orange;
38         }
39     </style>
40 </head>
41 <body>
42     <!-- <div class="father" id="box">
43         <p >上午</p>
44     </div> -->
45 
46     <div class="father">
47         <p class="son" id="baby">明天加油</p>
48     </div>
49 </body>
50 </html>

 

优先级之权重会叠加:
优先级的特点:
☆继承的权重为0,在继承关系中,如果自己没有样式,则跟随父样式,如果自己有样式,则按自己的样式,此时,父级的权重为0。
☆权重会叠加
  即使是100个标签选择器也抵不过一个类选择器

 

posted @ 2018-05-25 11:46  红领巾***  阅读(212)  评论(0编辑  收藏  举报