css三大特性

目录

一、层叠性

二、继承性

三、优先级

---

一、层叠性

1、概念

如果发生了样式冲突，那就会根据一定的规则（选择器优先级），进行样式的层叠（覆盖）

2、什么是样式冲突

元素的同一个样式名，被设置了不同的值，就是样式冲突

二、继承性

1、概念

元素会自动拥有其父元素、或其祖先元素上所设置的某些样式

2、规则

优先继承离得近的

3、常见的可继承属性

text-??     font-??     line-??     color 

4、举例

（1）代码

div {
    color: aqua;
    font-size: 30px;
}
p {
    color: chartreuse;
}

（2）运行效果

 三、优先级

1、简单

（1）优先级

!important > 行内样式 > ID选择器 > 类选择器 > 元素选择器 > * > 继承的样式

（2）举例

①代码

div {
    color: aqua;
    font-size: 30px;
}
p {
    color: chartreuse;
}
* {
    color: cadetblue;
}

<div>
    hello
    <span>你好</span>
    <p>
        <span>hi</span>
    </p>
</div>

②运行效果

 2、详细

（1）需要计算权重

（2）计算权重时需注意：并集选择器的每一个部分是分开算的