CSS教程:網(wǎng)頁(yè)布局定位及z-index解釋
互聯(lián)網(wǎng) 發(fā)布時(shí)間：2008-10-17 19:25:37 作者：佚名 
我要評(píng)論
我要評(píng)論聲明
定位元素：
position屬性值設(shè)置除默認(rèn)值static以外的元素，包括relative，absolute，fixed。
平臺(tái)：win/IE win/FF
z-index
用來(lái)確定定位元素在垂直于顯示屏方向（以下稱為Z軸）上的層疊順序
值：auto | 整數(shù) | inherit
默認(rèn)：auto
適用于：定位元素
繼承性
測(cè)試
FF下測(cè)試
運(yùn)行代碼框
[Ctrl A 全部選擇 提示：你可先修改部分代碼，再按運(yùn)行]
測(cè)試頁(yè)面：
http://rong179.blogbus.com/files/12163574750.html（請(qǐng)分別在FF3.0和FF2.0中打開(kāi)）
代碼說(shuō)明：
由前所述，如果元素的stack level同級(jí)則后來(lái)居上；元素的stack level高，這無(wú)論代碼在文檔中位置如何都顯示在上面，即使代碼在最前面；如果元素的stack level低，無(wú)論代碼位置如何都將顯示在下面，即使代碼在最后面。
我們就根據(jù)這一點(diǎn)，以“3.文本流中非定位的、block塊級(jí)子元素”和“4.文本流中非定位的、float浮動(dòng)子元素”為例，如果我把“float元素” 的代碼寫(xiě)在“block元素”的前面，且實(shí)際顯示為：“float元素”在“block元素”之上。即可證明："float元素”的stack level級(jí)別較“block元素”高。因?yàn)槿绻?jí),或者“block元素”的stack level高都應(yīng)是“block元素”顯示在上。
根據(jù)以上，根據(jù)標(biāo)準(zhǔn)中的順序，把stack level高的元素代碼寫(xiě)在前面，stack level低的代碼寫(xiě)在后面，如果顯示結(jié)果是：代碼在前面的元素顯示在上方 ，即證明上面的stack level規(guī)則。
測(cè)試結(jié)果：
相關(guān)文章
- z-index最大值,最小值以及同值時(shí)層的高低，做了個(gè)測(cè)試z-index的最大值,有幾個(gè)結(jié)論如下2009-05-28
- z-index屬性簡(jiǎn)介 引用: z-index : auto | number auto：默認(rèn)值。 number：無(wú)單位的整數(shù)值，可為負(fù)數(shù)。 z-index 值較大的元素將疊加在z-index值較小的元素之上。對(duì)2009-05-29
CSS教程:元素層疊級(jí)別及z-index-CSS教程-網(wǎng)頁(yè)制作-網(wǎng)頁(yè)教學(xué)網(wǎng)
原文：http://rong179.blogbus.com/logs/24966909.html 聲明 定位元素：position屬性值設(shè)置除默認(rèn)值static以外的元素，包括relative，absolute，fixed。 平臺(tái)：win/I2008-10-17- 設(shè)置z-index時(shí)必須要固定位置，這樣設(shè)置它的值時(shí)才能奏效（例如 position:absolute;）下面是示例代碼，在ff3.5.5和ie5.5~ie8.0RC1中通過(guò)，大家可以嘗試著不固定其位置試試2009-11-26
- IE6/7對(duì)z-index的表現(xiàn)跟IE8及以上瀏覽器不一致。position值為非static時(shí)，如果不設(shè)置z-index屬性，IE6/7下z-index默認(rèn)為0，而IE8及以上瀏覽器z-index為auto，且zindex:auto2012-11-13
一個(gè)關(guān)于CSS Z-index 的東東,解決了我很多疑問(wèn)
發(fā)現(xiàn)有時(shí)候真得多看看書(shū),以前一直納悶為什么有時(shí)候可以,有時(shí)候不可以,原來(lái)是這個(gè)原因.2011-03-23- 寫(xiě)了個(gè)最簡(jiǎn)單的DEMO，演示了3個(gè)DIV互相遮蓋的情況。記住：z-index要配合position屬性才有效2012-02-25
ie下的css層疊z-index各種問(wèn)題詳細(xì)整理
可是真有些日子沒(méi)有寫(xiě)DIV+CSS了，而且對(duì)IE6兼容性的坑碰到的還是不夠多(以前做國(guó)外項(xiàng)目)，所以這次開(kāi)發(fā)中不可避免的碰見(jiàn)了幾個(gè)問(wèn)題，尤其是在IE下的 z-index 問(wèn)題很有意思2013-01-09CSS元素的層疊與z-index設(shè)置-CSS教程-網(wǎng)頁(yè)制作-網(wǎng)頁(yè)教學(xué)網(wǎng)
我們?cè)谖恼碌母轮?，特別注重對(duì)新手的輔導(dǎo)，但webjx.com面對(duì)的是廣大的開(kāi)發(fā)人員，大家可能會(huì)遇到各種各樣的問(wèn)題，有些問(wèn)題很不常見(jiàn)，或者應(yīng)用的很少，但我們依然有必2008-10-17- 在這篇文章里，我們會(huì)準(zhǔn)確的說(shuō)明究竟什么是Z-index，它為什么會(huì)這么不為人所了解，并一起討論一些關(guān)于它的實(shí)際使用中的問(wèn)題。我們同時(shí)會(huì)描述一些會(huì)遇到的瀏覽器間的差異，2014-10-22