[IE8修練大會] IE8:三種模式,全新感受!

  • 28159
  • 0

Windows Internet Explorer 8在對於W3C標準的技術,例如CSS 2.1上總算是重新下了一點功夫。然而,由於過去通常一般網頁對於IE的特別處置較多,導致如果採用標準方式可能會導致網頁出現支援上的問題。 而Internet Explorer 8有一套聰明但是十分複雜的解決方法:簡而言之:三種模式,兩種自動選擇方法。

Windows Internet Explorer 8在對於W3C標準的技術,例如CSS 2.1上總算是重新下了一點功夫。然而,由於過去通常一般網頁對於IE的特別處置較多,導致如果採用標準方式可能會導致網頁出現支援上的問題。而Internet Explorer 8有一套聰明但是十分複雜的解決方法:簡而言之:三種模式,兩種自動選擇方法

所以是哪三種模式呢?

  • Quirks模式:和Internet Explorer 6、7相同,在陳舊而極不符合網頁標準的網頁會自動套用這個模式。在此模式下,會使用舊版Internet Explorer的錯誤排版(例如Box Model Bug)方式來排CSS。
  • IE7標準模式:和IE7下的標準模式相同,不支援IE8下的CSS功能,也因此不會遇到IE8更改後的CSS問題。
  • IE8標準模式:支援新CSS功能的標準模式,是IE8遇到對於支持HTML/XHTML標準的網頁時自動採用的模式。

IE8怎麼選擇模式?

IE8會透過你HTML中開頭的DOCTYPE去自動選擇適當的模式:DOCTYPE是宣告你要使用哪一種HTML標準的一種語法,定義DOCTYPE是撰寫HTML/XHTML標準網頁的第一關。遇到沒有定義DOCTYPE的HTML網頁或定義陳舊HTML版本(例如3.2)的網頁,就會採用Quirks Mode;反之,會盡可能採用標準模式。

而為了要避免相容性的大爆炸(?),IE留下了EmulateIE8和EmulateIE7兩種自動判斷方法。

在預設的EmulateIE8之下,IE8會這樣判斷模式:

  • HTML 4.01:
    • 大部分都會用IE8標準模式
    • 當Transitional或Frameset在沒有指定System Identifier(dtd網址)
  • XHTML1.0、HTML5:都會進IE8標準模式

EmulateIE7模式也就是目前所謂的「相容性檢視」,IE8會以IE7時的DOCTYPE判斷方式來判斷模式,選擇要採用Quirks模式還是IE7標準模式。大體而言和EmulateIE8沒有差別,只是原來會進IE8標準模式的網頁會直接改進IE7標準模式

我寫了一個簡單的網頁(目前的缺失:沒有辦法選EmulateIE7/IE8)來示範DOCTYPE和自動模式選擇的結果。玩玩看吧!這有點複雜 :)。

Photo sharing and image hosting - EchoPic

強迫IE8選用特定的模式

你可以透過由伺服器送HTTP Header(HTTP標頭,可以透過IIS/Apache的設定調整)或透過meta標籤的方式來強迫IE8使用最佳的模式,以避免IE8內定選擇的模式不合你的需求。Will保哥有撰寫一篇文章介紹Server端可行的方案,而你在單獨的網頁中,也可以透過<meta>標籤來指定模式。舉例而言,如果我希望我的網頁以IE7標準模式執行:

<meta http-equiv="X-UA-Compatible" content="IE=7">

 

IE=X可以填什麼如附表:(這部分參考了IE8 Beta1的開發白皮書

IE=X什麼模式?
IE=EmulateIE8IE8的自動判斷
IE=EmulateIE7IE7的自動判斷
IE=5Quirks Mode
IE=7IE7標準模式
IE=8IE8標準模式

EmulateIE8/EmulateIE7適合用在伺服器端。舉例而言,如果你在IIS/Apache下設IE=EmulateIE7,符合標準的網頁就會用IE7標準模式,陳舊/不符合標準的網頁就會用Quirks模式,一口氣解決IE8下的問題!

IE=5,7,8適合用在單獨網頁,直接對特定網頁鎖定一種想要用的模式來解決你的問題。

 講了那麼多,我的網頁在IE8上出了問題,該怎麼辦?

我個人的建議會是這樣:

  • 盡有可能在未來撰寫符合W3C標準的網頁。雖然現況而言這樣並不好,因為這也表示你得花很多時間在除IE6的CSS大蟲上面。
  • 如果你需要一個暫時的方案,如上文所述,在你跑的Server上加上X-UA-Compatible為IE=EmulateIE7的HTTP標頭

W3C的標準像是CSS3啦,HTML5啦會陸續在未來的瀏覽器登場,對於網頁標準的相容看起來IE也會愈走愈近。所以IE8的這段時間可能網頁設計的人會為了迎合新標準而很辛苦囉 :( 所以現在趕快試試看多用一點點標準語法吧。

參考資料