z-index的重要性

在我看來，z-index 給了我們日常工作中以極大的幫助，我們用它來定義元素的層疊級別（stack level）。受益于它，你能做Popup, DropDown, Tips, 圖文替換等等。

在開始本篇之前，或許我們要先了解一下關于z-index的基本信息。

W3C這樣描述

每個元素都具有三維空間位置，除了水平和垂直位置外，還能在 "Z軸" 上層層相疊、排列。元素在 "Z軸" 方向上的呈現順序，由層疊上下文和層疊級別決定。

在文檔中，每個元素僅屬于一個層疊上下文。元素的層疊級別為整型，它描述了在相同層疊上下文中元素在 "Z軸" 上的呈現順序。

同一層疊上下文中，層疊級別大的顯示在上，層疊級別小的顯示在下，相同層疊級別時，遵循后來居上的原則，即其在HTML文檔中的順序。

不同層疊上下文中，元素呈現順序以父級層疊上下文的層疊級別來決定呈現的先后順序，與自身的層疊級別無關。

順序規則

如果不對節點設定 position 屬性, 位于文檔流后面的節點會遮蓋前面的節點.

發表評論 共有條評論 用戶名: 密碼: 驗證碼: 匿名發表