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个标签选择器也抵不过一个类选择器