Style zIndex属性

定义和用法

zIndex 属性设置或返回定位元素的堆叠顺序。

具有较大堆叠顺序(1)的元素始终位于具有较低堆叠顺序(0)的另一个元素之前。

提示：定位元素是 position属性 设置为：relative、absolute 或 fixed 的元素。

提示：如果要创建重叠元素，此属性很有用。

另请参阅：

CSS教程：CSS ƙarƙa

CSS参考手册：z-index属性

实例

例子1

更改<img>元素的堆叠顺序：

document.getElementById("img1").style.zIndex = "1";

亲自试一试

例子2

更改<div>元素的z-index属性值：

document.getElementById("myDIV").style.zIndex = "-1";

亲自试一试

例子3

返回<img>元素的z-index属性值：

alert(document.getElementById("img1").style.zIndex);

亲自试一试

语法

返回zIndex属性：

object.style.zIndex

设置zIndex属性：

object.style.zIndex = "auto|number|initial|inherit"

属性值

值 描述
auto 浏览器确定元素的堆叠顺序（基于它在文档中的顺序）。默认。
number 定义元素的堆叠顺序的整数。允许负值。
initial 将此属性设置为其默认值。请参阅 initial。
inherit 从其父元素继承此属性。请参阅 inherit。

技术细节

默认值： auto
返回值： 字符串，表示元素的堆叠顺序。
CSS版本： CSS2

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持