CSS-三大特性

共计 669 个字符，预计需要花费 2 分钟才能阅读完成。

1.层叠性

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

• 样式冲突，遵循的原则是就近原则，那个样式离结构近，就执行那个样式
• 样式不冲突，不会层叠

2.继承性

子标签会继承父标签的某些样式，如文本颜色和字号，简单的理解就是：子承父业

• 恰当的使用继承可以简化代码，降低 CSS 样式的复杂性
• 子元素可以继承父元素的样式（text-, font-, line- 这些元素开头的可以继承，以及 color 属性）

行高的继承

body {
    font: 12px/1.5 Microsoft YaHei;
}

• 行高可以跟单位也可以不跟单位
• 如果子元素没有设置行高，则会继承父元素的行高为1.5
• 此时子元素的行高是：当前子元素的文字大小*1.5
• *body 行高 1.5 这样写法最大的优势就是里面子元素可以根据自己文字大小自动调整行高

3.优先级

权重

• 可以简单记忆法：通配符和继承权重为0，标签选择器为1，类（伪类）选择器为10，id选择器为100，行内样式为1000，!important 无穷大
• 继承的权重是0，如果该元素没有直接选中，不管父元素权重多高，子元素得到的权重都是0

权重叠加
如果是复合选择器，则会有权重叠加，需要计算权重

0,0,0,1 + 0,0,0,1 + 0,0,0,1
div ul li  ----->          0,0,0,3
0,0,1,0 + 0,0,0,1 + 0,0,0,1
.nav ul li ----->          0,0,1,2
0,0,1,0 + 0,0,0,1
a:hover    ----->          0,0,1,1
0,0,1,0 + 0,0,0,1
.nav a     ----->          0,0,1,1