CSS选择器的优先级数

CSS学习笔记之权重（选择器的优先级数）：

权重：就是优先级的等级

数字化的话
#id 权重   100
.class  权重  10
div(html标签) 权重 1

1. #test div p{
   
2.  color : red
   
3. }
   
4. div .cls{
   
5.  backgroundColor:blank;
   
6.  color : white;
   
7. }
   
8. div p {
   
9.  color : gray;
   
10. }

复制代码

#test div 权重就是100+1 = 101
div .class 就是1+10 = 11
div p 就是1+1=2
其余类似……可以看一下下面这段代码到底执行上面哪个样式

1. <div id="test">
   
2. <p class="cls">我是什么颜色</p>
   
3. </div>

复制代码

而行内样式例如style=""……这样的权重数字化的话，大概就是1000
但是，不建议这样写，大师都提倡我们行为与样式分离

1. <div id="test">
   
2. <p style="color:#efefef">我是什么颜色</p>
   
3. </div>

复制代码

另外昨天还忽然发现：
#id.cls   (注意，没有空格)就是选择有此id并且有此class的标签
#id .cls  (加了个空格)就是大家都知道的此id标签下的拥有此class的标签了