CSS中可以使用 z-index
属性来设置层叠顺序。z-index
属性的值为一个整数,值越大的元素越优先显示在其他元素之上,即具有更高的层叠顺序。
需要注意的是,z-index
属性只对定位元素(即 position
属性值为 absolute
、relative
或 fixed
)生效。如果多个定位元素的 z-index
值相同,则它们的层叠顺序由它们在HTML文档中的先后顺序决定。
示例如下:
div {
position: relative;
z-index: 2;
}
span {
position: absolute;
z-index: 1;
}
上述CSS代码中,div
元素的层叠顺序为 2,span
元素的层叠顺序为 1,因此 div
元素会显示在 span
元素之上。
需要注意的是,z-index
属性的取值不能是负数。