CSS样式层叠覆盖

在CSS中，当多个样式同时作用于同一个元素时，就会涉及到层叠覆盖的问题。使用CSS样式层叠覆盖，我们可以控制不同样式之间的作用和优先级。

层叠顺序，也称为层叠上下文（stacking context）决定哪个元素在图层中显示在其他元素的前面或后面。层叠顺序是根据以下因素计算出来的：

• 元素的定位方式（position）
• 元素的堆叠顺序（z-index）
• 元素的文档流位置

下面是层叠顺序的示例代码：

.box-1 {
position: absolute;
z-index: 1;
}
.box-2 {
position: relative;
z-index: 2;
}

在这个例子中，box-2元素由于z-index高于box-1，因此会显示在box-1之上。