HTML5 04_CSS三大特性

一.CSS三大特性

1.CSS层叠行

是浏览器处理冲突的一个能力。如果一个属性通过两个选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉

2.CSS继承性

子元素可以继承父元素的样式，但是具有一定的特殊性：

①并不是所有的属性都可以继承, 只有以color/font-/text-/line-开头的属性才可以继承。

②在CSS的继承中不仅仅是儿子可以继承, 只要是后代都可以继承 。

③a标签的颜色和下划线的设置不能继承，必须对a标签本身进行设置。

④h标签的字体大小不能修改，必须对h标签本身进行修改。

3.CSS优先级

优先级表示当多个选择器选中同一个标签, 并且给同一个标签设置相同的属性时, 如何层叠就由优先级来确定

3.1.优先级判断

!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

①如果使用的是同类型的选择器，那么谁写在后面就听谁的。就近原则

②如果使用的是不同类型的选择器，那么会按照选择器的优先级来层叠。

3.2.!important

用于提升选择器中某个属性的优先级, 可以将被指定属性的优先级提升为最高 。

①!important只能提升被指定的属性的优先级, 其它的属性的优先级不会被提升

②!important必须写在属性值得分号前面，与属性值之间加上一个空格 。

③!important前面的感叹号不能省略

3.3.优先级权重

当多个选择器混合在一起使用时, 我们可以通过计算权重来判断谁的优先级最高

①内联样式，如: style=””，权值为1，0，0，0

②ID选择器，如：#content，权值为0，1，0，0

③类，伪类和属性选择器，如.content E:link E[attr]，权值为0，0，1，0

④元素选择器和伪元素选择器，如div p ::before，权值为0，0，0，1

⑤通配符、子选择器、相邻选择器等的。如*、>、+,权值为0，0，0，0

⑥继承的样式没有权值。!important的权重最高