z-index屬性簡介
引用:z-index : auto | number
auto：預設值。
number：無單位的整數值，可為負數。
z-index 值較大的元素將疊加在z-index值較小的元素之上。對於未指定此屬性的定位物件，z-index 值為正數的物件會在其之上，而z-index 值為負數的物件在其之下。
注意：這個屬性不會作用於視窗控制項，如selct 物件。在ie 5.5＋中，iframe 物件開始支援此屬性。而在之前的瀏覽器版本中，iframe 物件是視窗控制項，會忽略此屬性。
z-index屬性適用於定位元素（position 屬性值為 relative 或 absolute 或 fixed的物件），用來確定定位元素在垂直於顯示屏方向（稱為z軸）上的層疊順序（stack order）。
每乙個定位元素都歸屬於乙個stacking context。根元素形成root stacking context，而其他的stacking context則由定位元素產生（此定位元素的z-index被定義乙個非auto的z-index值），定位子元素會以這個local stacking context為參考，用相同的規則來決定層疊順序。並且stacking context和 containing block 之間並沒有必然聯絡。
當stacking context一樣的時候，就用z-index的值來決定怎樣顯示，如果z-index也相同（即stack level相同），則按照檔中後來者居上的原則（back-to-front ）的順序來層疊。
當任何乙個元素層疊另乙個包含在不同stacking context元素時，則會以stacking context的層疊級別（stack level）來決定顯示的先後情況。也就是說，在相同的stacking context下才會用z-index來決定先後，不同時則由stacking context的z-index來決定。例如：
定位元素a（z-index:100）裡面有定位元素a1（z-index:300），而定位元素b和元素a兄弟關係（z-index:200）。你會發現無論a1的z-index是多大，也會被z-index是200的b所覆蓋，因為a的z-index只有100。
閱讀更詳細的內容：
z index在IE中的迷惑
今天在寫頁面的時候發現頭部導航欄的下拉列表，被下面的畫中畫遮擋住了，然後把導航的下拉列表樣式設定為z index 999 但是在ie下沒起什麼作用，而在ff下起作用了。然後又把畫中畫的樣式設定為z index 99 在ie下還是沒反映。囧。ie下 ff下 然後在google裡搜尋了一下z index...
z index在IE中的迷惑
今天在寫頁面的時候發現頭部導航欄的下拉列表，被下面的畫中畫遮擋住了，然後把導航的下拉列表樣式設定為z index 999 但是在ie下沒起什麼作用，而在ff下起作用了。然後又把畫中畫的樣式設定為z index 99 在ie下還是沒反映。囧。ie下 ff下 然後在google裡搜尋了一下z index...
在IE中的z index屬性
z index屬性簡介 引用 z index auto number auto 預設值。number 無單位的整數值，可為負數。z index 值較大的元素將疊加在z index值較小的元素之上。對於未指定此屬性的定位物件，z index 值為正數的物件會在其之上，而z index 值為負數的物件在...