14、CSS 中的继承与层叠机制解析

CSS 中的继承与层叠机制解析

在 CSS 中，继承和层叠是两个非常重要的概念，它们与选择器和属性一样基础。下面将详细介绍这两个概念以及相关的应用。

伪类选择器回顾

在深入继承和层叠之前，先回顾两个伪类选择器：
- :not 否定伪类：根据元素不是什么来应用样式。
- :target 伪类：对作为其他元素目标的元素应用样式。

继承

CSS 的设计目的之一是简化网页文档的创建，它允许一个属性应用于文档中的所有元素。当一个属性应用于某个特定元素时，它的子元素也会保留这些属性值，这种行为称为继承。

可继承属性

许多 CSS 属性是可继承的，继承使得编写样式表变得轻松。常见的可继承属性包括大多数文本属性和字体属性。例如：

div#parentdiv {
    text-align: center;
}

<div id='parentdiv'>
    Some text aligned center.
    <div>
        Because the text-align property is inherited, 
        this text is also aligned center.
    </div>
</div>

在上述代码中， text-