css三大特性：
层叠性，继承性，优先级。
层叠性（覆盖性）：
- 相同选择器的相同属性的不同值会发生冲突，此时采取就近原则。
- 相同选择器的不同属性不会发生冲突。
代码示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<Style>
div {
color: red;
}
div {
color: blue;
}
</Style>
</head>
<body>
<div>就近原则显示蓝色</div>
</body>
</html>
网页效果：
继承性：
- 子标签继承父标签的某些样式
- 和文字相关的属性以及颜色会继承
- 盒子的长宽和边距等不会继承
代码示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
color: red;
/* 让div包含P标签，成为父标签 */
}
</style>
</head>
<body>
<div>
<p>此处p是子标签会继承父类的颜色，为红色</p>
</div>
</body>
</html>
网页效果：
优先级：
给同一个元素定义了多个选择器，有冲突的属性，判断应该使用哪个选择器
| 选择器--------------------- | 权重-------- |
|继承或*----------------------|0，0，0，0|
| 元素选择器（标签）— |0，0，0，1 |
| 类选择器，伪类选择器 |0，0，1，0 |
| id选择器------------------- |0，1，0，0 |
| 行内样式------------------ |1，0，0，0 |
相同种类的选择器，采取就近原则。
复合选择器会有权重叠加的情况，解决方法是权重相加（不会进位）
例；
ul li{} 权重为 0，0，0，1+0，0，0，1=0，0，0，2
li{}权重0，0，0，1
所以选择选择器ul li