Day 11 CSS <三大特性>

CSS中语法有着三大特性 分别为: 层叠性、继承性、优先性

1. 层叠性

若是设置给相同选择器相同的样式

此时一个样式就会覆盖(层叠)另一个冲突的样式

层叠性主要解决样式冲突的问题

原则:

• 样式冲突遵循就近原则，哪个离结构进选哪个
• 样式不冲突，不会层叠

2. 继承性

CSS中的继承:子标签会继承父标签的某些样式

• 使用CSS继承特性可以简化代码，降低CSS样式的复杂
• 子元素可继承父元素的样式

EX :(text- , font-,line- & color)

行高继承性:

body{

font : 12px/1.5 '字体';

}

(1.5 = 当前元素文字大小font-size的1.5倍行高)

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

3. 优先性

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

• 选择器相同 则执行层叠性
• 选择器不同 根据选择器权重执行

优先级注意事项:

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

2. 可以理解为类选择器永远大於元素选择器 ID选择器永远大於类选择器 以此类推

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

4. 可以使用简单记忆法：
   通配符和继承权重为0，标签选择器为1

   类(伪类)选择器为10，ID选择器为100

   行内样式选择器为1000，!important无穷大

5. 继承权重为0，系统默认给<a>标签蓝色斜线

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

CSS权重(specificity) By 欧瑞