CSS特性：继承和层叠

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

在css中也存在着继承关系，与面向对象的编程语言不同，css的继承很简单，而且主要指的是在CSS盒模型中，外围的盒子的样式会被内部所包含的盒子所继承。具体来了解一下。

HTML元素之间存在一个”树型“关系，这个关系使得样式发生继承。
1. 子元素会继承父元素的样式

2. 子元素可以定义自有样式

3. 子元素可以改变从父元素继承而来的样式

4. 子元素的样式不会反作用于父元素（继承是单向的）

5. 每个元素都遵循样式继承的概念。

6. 样式继承是一个抽象（抽象是提取共同点的方法）的过程，抽象程度越高，其适用范围就越光，复用性就月高。

CSS样式之间既存在继承关系，还存在层叠关系，何谓层叠：白色跟黑色层叠，变成灰色；要了解层的概念，就好比玻璃，有红色的，有透明的，有白色，有绿色。将它们堆叠在一起，不同的组合在视觉上产生的效果是不同的。也可理解为冲突的解决方案

要弄清楚样式层叠时的冲突解决方案，就要了解，解决的原则：元素使用不同的选择器所设置的样式的优先级是不同的。在同一对象中,当样式冲突时，根据优先级高的样式进行显示，其优先级的关系为：

1. 单个样式：行内 > ID >类别 > 元素 2. 多个类：前面 > 后面

继承和层叠是客观的存在的，必然存在继承和层叠，可以通过添加控制局部元素的代码实现继承，层叠样式的额改变。层叠和继承都有很大的优点，但是有时也会给开发造成麻烦，只有深入领悟其真谛，才能使用继承和层叠有的放矢。