|
堆疊，分層和 layout
IE/Win 中似乎有兩種分層和堆疊順序：
·一種是(偽)試圖采用CSS的模式：Effect of z-index value to RP and AP blocks
·還有一種是由“hasLayout”及其孿生兄弟“contenteditable”的行為產(chǎn)生的堆疊順序。正如在上面相對(duì)定位的例子中展現(xiàn)的那樣，在 layout 影響下的堆疊現(xiàn)象就好像 Harry Houdini (譯者注：魔術(shù)師，以紙牌魔術(shù)成名)的拿手戲法兒一樣。
兩種堆疊模式雖互不相容，但卻共存于IE的渲染引擎中。經(jīng)驗(yàn)之談：調(diào)試的時(shí)候，兩種情況都要考慮到。我們可能會(huì)有規(guī)律地在下拉菜單或者類似的復(fù)雜菜單中看到相關(guān)問題，因?yàn)樗鼈兺鶢可娴蕉询B，定位和浮動(dòng)等諸多令人頭疼的問題。給那些 z-index 定位的元素 layout 是一種可能的修正方法，不過也不限于此，這里只是提醒一下。
混亂的 contenteditable
如果給一個(gè) HTML 標(biāo)簽設(shè)定 contenteditable=true 屬性，比如，將會(huì)允許對(duì)該元素以及其 layout 子元素進(jìn)行實(shí)時(shí)的編輯、拖動(dòng)改變尺寸等操作。你可以把這屬性用在浮動(dòng)元素或者一個(gè)有序列表中的 layout 列表元素上看看效果。
為了對(duì)元素進(jìn)行操作(編輯它們)，“contenteditable”和“hasLayout”為那些 hasLayout 返回 true 的元素引入了一套單獨(dú)的堆疊順序。
Editing Platform 繼承了 layout 概念，對(duì) layout 的誤解多是因 contenteditable 而起即可作為證明(那些某種程度上集成了IE編輯引擎的應(yīng)用軟件多暗含著對(duì)layout概念的某種強(qiáng)制向后兼容性)。
·More on contenteditable
和 CSS 規(guī)范類似的地方
你的 MSIE 頁面在別的瀏覽器中一團(tuán)糟？我們可沒必要讓這種事情發(fā)生。如果使用恰當(dāng)，任何好的瀏覽器都能擺平 MSIE 的頁面——只要你使用一些正確的 CSS。
利用 hasLayout 和“新的塊級(jí)格式化范圍”之間的細(xì)微相似之處，我們可以有幾種方法在標(biāo)準(zhǔn)兼容瀏覽器中重新實(shí)現(xiàn) hasLayout 的“包含浮動(dòng)元素”效果，和一些“浮動(dòng)元素旁邊的元素”所特有的效果。
·Reverse engineering series
·Simulations
Quirks 模式
關(guān)于這種渲染模式的的信息，請(qǐng)參考我們的 quirks 模式 章節(jié)。
Layout ——結(jié)論
整個(gè) layout 概念和一些基本 CSS 概念是不兼容的，即包含，排列，浮動(dòng)，定位和層疊等。
由于頁面中元素或有或沒有 layout，會(huì)導(dǎo)致 IE/Win 的行為和 CSS 規(guī)范相違背。
擁有 layout ——另外一個(gè)引擎？
IE 的對(duì)象模型看起來是文檔模型和他們傳統(tǒng)的應(yīng)用程序模型的糅合。我之所以提到這點(diǎn)是因?yàn)樗鼘?duì)于理解IE如何渲染頁面很重要。而從文檔模型切換到應(yīng)用程序模型的開關(guān)就是給一個(gè)元素“l(fā)ayout”。
(Dean Edwards)
有時(shí)候要解釋清楚某種行為是不可能的：就比如 hasLayout，會(huì)根據(jù)它的狀態(tài)選擇兩種不同渲染引擎的一種使用，而且每一種都有其自己的 bug 和怪異之處。
不可消除的 bug
軟件 bug 是由于在制作過程中對(duì)完整性和邏輯問題考慮不周等人為錯(cuò)誤而導(dǎo)致的。這是人類的固有缺陷，目前還沒有什么好的解決方法。
同樣由于這種缺陷，任何試圖不重寫軟件而修復(fù) bug 的做法，都將會(huì)不可避免的導(dǎo)致軟件中出現(xiàn)更復(fù)雜的bug。
所有依賴別的軟件的軟件——當(dāng)然包括依賴操作系統(tǒng)，也會(huì)同樣依賴他們的 bug。于是我們會(huì)從所有關(guān)聯(lián)的軟件中得到一連串的 bug，這也更說明找到一個(gè)無 bug 軟件是幾乎不可能的。
(Molly, the cat‛)
本文創(chuàng)建于2005年6月30日，最后一次修改于2006年4月2日。
編者：
Holly Bergevin
Ingo Chao
Bruno Fassino
John Gallant
Georg Sørtun
Philippe Wittenbergh
特別致謝給予此項(xiàng)目支持的：
Dean Edwards, and Molly the cat
各種語言版本：
Original(English)
Brazilian Portuguese by Mauricio Samy Silva
中文版本 by old9
Italian by Gabriele Romanato
相關(guān)討論：
dean.edwards.name/weblog/
聯(lián)系作者：
spam.layout@satzansatz.de
版權(quán)說明：
本文基于 創(chuàng)作共用協(xié)議 發(fā)布。
目錄
介紹
hasLayout —— 定義
術(shù)語
問題種種
Layout 從何而來
默認(rèn) layout 元素
屬性
有關(guān)內(nèi)聯(lián)級(jí)別元素
腳本屬性 hasLayout
CSS hacks
Hack整理
關(guān)于 IE Mac 的小問題
MSDN文檔
分析
各種情況的詳細(xì)說明
清除浮動(dòng)和自動(dòng)擴(kuò)展適應(yīng)高度
浮動(dòng)元素旁邊的元素
列表
表格
相對(duì)定位元素(r.p.)
絕對(duì)定位元素(a.p.)：包含區(qū)塊，什么是包含區(qū)塊？
濾鏡
對(duì)已渲染元素的重排(re-flow)
背景原點(diǎn)
邊距重疊
塊級(jí)別的鏈接
在頁面內(nèi)使用鍵盤瀏覽：探索中
收縮包圍(shrink-wrapping)現(xiàn)象
邊緣裁切
堆疊，分層和 layout
混亂的 contenteditable
和 CSS 規(guī)范類似的地方
Quirks 模式
Layout —— 結(jié)論
擁有 layout —— 另外一個(gè)引擎？
不可消除的 bug
出處：web.Frontend
責(zé)任編輯：moby
上一頁 On having layout [4] 下一頁
◎進(jìn)入論壇網(wǎng)站綜合、網(wǎng)頁制作版塊參加討論
|
第 1 頁 
第 5 頁 On having layout [5]
