Z 軸索引排序
Z 軸索引可在當有兩個或多個元素佔用相同的區域時，指定元素的繪製順序。每當您的絕對或相對定位元素與網頁中的其他元素重疊時，設定 Z 軸索引會很有幫助。
您可以使用 z-index 屬性設定 Z 軸索引。設為正數值會使元素堆疊在其他元素之上，而設為負數值會使元素堆疊在其他元素之下。下列範例使用 Z 軸索引使文字堆疊在影像之上：
<html>
<head><title>Stack the Image</title>
</head>
<body>
<p style="position: absolute; top: 0px; left: 0px;">Text Over Image</p>
<img src="sample.jpg" style="position: absolute; top: 0px; left: 0px; z-index: -1;"/>
</body>
</html>
Z 軸索引值最高的元素一定會放置在堆疊的頂端，而 Z 軸索引值最低的元素則會放置在底部。如果有兩個元素具有相同的 Z 軸索引，則會以來源順序決定堆疊的順序 (最後的元素堆疊在較高的位置)。
.gif "Note") 注意： |
|---|
您不能使用指標裝置 (如滑鼠) 的輸入與堆疊在其他元素下的元素互動。您可能會希望能與定位在不可見物件下的可見物件互動，不過位在堆疊頂端之物件具有較高的選取順位。這也適用於 Z 軸索引為負數的定位元素，但父項為捲動容器 (即父項的 overflow 屬性設為 auto 或 scroll )，或父項是以手動方式定位 (即父項的 position 屬性設為 absolute 、 relative 或 fixed ) 的情況除外。 |
您可以依照下列範例，透過設定 z-index 屬性的方式動態變更 Z 軸索引：
Myimg.style.z-index = 2;
某些元素 (包括 IFRAME 與部分 ActiveX 控制項) 不會受到 z-index 屬性的影響，並且無法和受 z-index 屬性影響的元素正常互動。
| 注意： |
|---|
雖然固定位置的元素與已呈現網頁中的不同組件相關，不過它們還是會受到絕對定位元素的相對堆疊順序影響。 |