CSS特性

层叠性

相同选择器给设置相同的样式，此时一个样式会覆盖（层叠）另一个冲突的样式。层叠性主要解决样式冲突问题。

原则：

• 样式冲突，就近原则。

• 样式不冲突，不会层叠。

继承性

子标签会继承父标签的某些样式，比如文本颜色和字号等。

• 恰当使用继承可以简化代码，降低样式复杂性。

• 子元素可以继承父元素的样式（text- , font- , line- , color 这些元素开头的可以继承）

额外内容 1：行高的继承性

• 行高可以跟单位也可以不跟单位

• 父元素如果设置行高 1.5，子元素没有设置行高，则子元素继承父元素行高 1.5。写法优势为子元素可根据自己文字大小自动调整行高。

优先级

当同一个元素指定多个选择器，就会有优先级产生。

• 选择器相同，执行层叠性。

• 选择器不同，根据选择器权重执行。

选择器	选择器权重
继承 或者 *	0,0,0,0
元素选择器	0,0,0,1
类选择器，伪类选择器	0,0,1,0
ID 选择器	0,1,0,0
行内样式 style ""	1,0,0,0
!important 重要的	∞ 无穷大

注意

1. 权重由 4 组数字组成，但是不会有进位。

2. 可以理解为类选择永远大于元素选择器，id 选择器永远大于类选择器，以此类推。

3. 等级判断从左向右，如果某一位数值相同，则判断下一位数值。

4. 继承的权重是 0，如果该元素没有直接选中，不管父元素权重多高，子元素继承后权重仍为 0。

额外内容 2：权重叠加

1. 复合选择器权重叠加

2. 权重虽然会叠加，但是永远不会有进位。