看到的一篇好文章,分享給自己,主要是看起來比較輕松 很容易理解。
--------------------------------------------------------------------------
今天試着翻譯了Peter-Paul Koch這篇文章,希望對大家有所幫助。
原文鏈接:Quirks mode and strict mode 地址是:http://www.quirksmode.org/css/quirksmode.html
怪異模式和嚴格模式(譯注:一般稱為標准模式:Standards Mode,下文中的嚴格模式都可以理解為標准模式)是瀏覽器解析CSS時的兩種‘模式’。這篇文章將簡單闡述這兩種模式之間的差異。
譯注:一個網頁一般由兩部分組成即:HTML(Hypertext Markup Language)和CSS(Cascade Style Sheets)。
HTML負責描述網頁的結構和內容(如標題,導航欄等),而CSS則負責網頁的表現(外觀)(如背景顏色,字體樣式等)。
問題的產生:
當Netscape4(譯注:網景公司早期的瀏覽器)和IE4(微軟公司早期的瀏覽器)實現CSS機制時,並沒有遵循W3C提出的標准。Netscape4 提供了糟糕的支持,而IE4 雖然接近標准,但依舊未能完全正確的支持標准。盡管IE 5 修復了IE4 許多的問題(bugs),但是依然延續CSS實現中的其它故障(主要是盒模型(box model)問題)。
為了保證自己的網站在不同的瀏覽器中都能正確展現,網頁開發者不得不依據各個瀏覽器的自身的規范來使用CSS。因此大部分網站的CSS實現並未符合W3C的標准。
然而隨着標准一致性變得越來越重要,瀏覽器開發商不得不面臨一個艱難的抉擇:逐漸遵循W3C的標准是前進的方向。但是改變現有CSS的實現,完整去遵循標准,會使許多網站或多或少受到破壞。如果瀏覽器突然以正確的方式解析現存的CSS,陳舊的網站顯示必然受到影響。
因此立即遵循標准會產生問題,然而忽略標准則又會維持瀏覽器大戰時(譯注:微軟和網景之間的一段競爭)所產生的混亂。
解決方案:
任何的解決方案必須跟隨如下兩個方面:
1:允許網站開發者能夠選擇他們所熟知的模式。
2:依然使用舊式規則顯示陳舊的網站。
換句話說,所有的瀏覽器需要提供兩種模式:怪異模式(即兼容模式)服務於舊式規則,嚴格模式服務於標准規則。Mac平台的IE瀏覽器最先實現這兩種模式,Mozilla, Safari、Opera和Windows平台的IE6也相繼實現了這兩種模式。WIndows平台的IE5和Netscape4則只提供了怪異模式。
選擇使用哪種模式需要一個觸發器,而 “DOCTYP切換” 則用於此目的。依照標准,任何一個(X)HTML文檔必須擁有一個DOCTYPE(譯注:DTD(文檔類型定義)是一組機器可讀的規則,它們指示(X)HTML文檔中允許有什么,不允許有什么,DOCTYPE正是用來告訴瀏覽器使用哪種DTD,一般放在(X)HTML文檔開頭聲明)用以告訴其他人這個文檔的類型風格
1:產生於標准化浪潮以前的網頁並沒有DOCTYPE聲明。因此'沒有DOCTYPE'意味着觸發怪異模式:既依據舊式的CSS規則渲染網頁。
2:相反,如果開發者明確知道包含DOCTYPE,他們應該明白他們想要怎么做。因此大部分的DOCTYPE聲明將觸發嚴格模式:即依據標准的CSS規則渲染網頁。
3:任何新的或未知的DOCTYPE將觸發嚴格模式。
4:一些頁面依據怪異模式而寫,但是卻包含DOCTYPE。這種情況下各個瀏覽器依據自己的DOCTYPE規則列表來觸發怪異模式,參照這個瀏覽器比較圖表 。
注意:你的網頁並不一定要依據所選擇的DOCTYPE去獲得有效性驗證,一個DOCTYPE標簽足以觸發嚴格模式。
我在大部分網頁中使用如下的DOCTYPE。它除了聲明我的網頁是XHTML 1.0 過渡類型之外,還將在所有瀏覽器中觸發“准嚴格模式”(譯注:下文將介紹這個模式)
完美的解決方案?
就個人而言,我並不十分滿意“DOCTYPE切換”方案。一個DOCTYPE所提供的信息是(X)HTML文檔所擁有的類型風格,即文檔的結構,而不應該提供任何關於文檔表現(外觀)的信息,因為那違反了CSS關於頁面結構和表現分離的原則。
並發症:准嚴格模式
在早些時候,嘗試使用嚴格模式總是會產生關於圖片會突然獲得舊式的底部邊距,並且無法移除的討論。產生這個現象的原因是嚴格模式將標簽當成行內元素,這意味着一些空間將被保留給一些擁有”尾部“的字符如(g, j, q),而圖片並沒有“尾部”字符,所以這些空間將不會被使用,但是卻依舊保留着。
解決辦法是聲明圖片為塊級元素{display:block}
瀏覽器廠商,尤其是Mozilla,認為這是一種產生困惑的情況,於是他們引入了“准嚴格模式”(譯注:也稱為准標准模式 Almost Standards Mode),這與嚴格模式一樣,除了它將圖片當作塊級元素而不是行內元素。
Windows平台IE的特殊性 : XML聲明
在Windows平台的IE6 瀏覽器中,微軟實現了一個額外的規則:如果DOCTYPE聲明在XML聲明之后,將觸發怪異模式。這樣做是為了允許開發者在怪異模式下獲得“有效的網頁” (需要DOCTYPE)。下面是XML聲明,你需要將它放在頁面的開頭,在DOCTYPE之前。
注意這種行為已經從IE7 中移除。
譯注:Peter-Paul Koch在這篇文章后面列出了怪異模式和嚴格模式在不同瀏覽器中的一些重要表現,建議了解一下。