CSS基础4--冲突和继承

冲突

在默认情况下，一些css属性继承当前元素的父元素上设置的值，有些则不继承。这也可能导致一些和期望不同的结果

层叠

当应用两条同级别的规则到一个元素的时候，写在后面的就是实际使用的规则
简而言之，在最后的效果会生效

优先级

元素选择器不是很具体：优先级低
类选择器稍微具体点： 优先级高

  
    
    
      
  
  
    
猜猜我是什么颜色的
  

编写下CSS文件

.h-color {
    color: red;
}

h1 {
    color: blue;
}

打开浏览器查看效果

可见效果是红色的

继承

父元素上的css属性是可以被子元素继承

控制继承

inherit： 设置该属性会使子元素属性和父元素相同
initial： 设置属性值和浏览器默认样式相同
unset： 将属性重置为自然值，也就是如果属性是自然继承那么就是inherit，否则就是initial

考虑层叠

三个因素需要考虑
1.重要程度
2.优先级
3.资源顺序

不同类型的选择器有不同的分数值，把这些分数相加就得到特定选择器的权重，然后就可以进行匹配