| 網(wǎng)頁制作cnn6文章簡介：IE8有4種模式：IE5.5怪異模式、IE7標準模式、IE8幾乎標準模式、IE8標準模式。 |
觸發(fā)標準模式
1、加DOCTYPE聲明,比如：
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> < !DOCTYPE html>
2、設(shè)置X-UA-Compatible觸發(fā)。
觸發(fā)怪異模式
1、無doctype聲明、定義舊的HTML版本（HTML4以下,例如3.2）
2、加XML聲明，可在ie6下觸發(fā)
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE ...>
3、在XML聲明和XHTML的DOCTYPE之間加入HTML注釋，可在ie7下觸發(fā) <?xml version="1.0" encoding="utf-8"?>
< !-- keep IE7 in quirks mode -->
< !DOCTYPE ...>
5、<!--->放在<!DOCTYPE前面
IE8有4種模式：IE5.5怪異模式、IE7標準模式、IE8幾乎標準模式、IE8標準模式
X-UA-Compatible設(shè)置對IE8模式的影響：
1、設(shè)置X-UA-Compatible meta
IE=5、IE=6(介于5、6之間的任意數(shù)字，比如5.987654321)：觸發(fā)IE5怪異模式(無論頁面是否有DOCTYPE)
IE=7(7<= 值 <8)：強制IE7標準(無論頁面是否有DOCTYPE)
IE=EmulateIE7：遵循DOCTYPE(有DOCTYPE-IE7標準；無DOCTYPE-IE5怪異模式)
IE=EmulateIE8：遵循DOCTYPE(DOCTYPE-IE8幾乎標準模式(或IE8標準模式)；無DOCTYPE-IE5怪異模式)
IE=8、IE=Edge、IE=99、IE=9.9(大于等于8的)：有doctype-使用幾乎標準模式，或IE8標準；無doctype-IE8標準。
無X-UA-Compatible、IE=IE8、IE=IE7、IE=a、把X-UA-Compatible寫在<link>或<script>標簽后：判斷"X-UA-Compatible HTTP Header"。
注1：把X-UA-Compatible寫在<link>或<script>標簽下面，X-UA-Compatible的設(shè)置無效。
注2：頁面、服務(wù)器HTTP Header都設(shè)置了X-UA-Compatible的情況，使用頁面的X-UA-Compatible設(shè)置。頁面無X-UA-Compatible，才使用HTTP Header設(shè)置的值。
注3：幾乎標準模式的意思和觸發(fā)，下面的"Almost Standards Mode"有說明。
注4：IE=xx的值，ie會嘗試xx轉(zhuǎn)換為最接近的值。比如：IE=7.789 -> IE=7；介于5、6之間的->IE=5；大于等于8的->IE=8。
注5：IE=4、IE=3、IE=0.1、IE=-7 這些小于5的，包括類似IE=IE8、IE=IE7、IE=IE6、IE=a、IE=b、IE=bcd，和無X-UA-Compatible一樣一樣滴。可以理解為X-UA-Compatible設(shè)置了無效的值，所以跳過這里了。
2、設(shè)置X-UA-Compatible HTTP Header
IE=5、IE=6: 觸發(fā)IE5怪異模式(無論頁面是否有DOCTYPE)
IE=7(7<= 值 <8): 強制IE7標準(無論頁面是否有DOCTYPE)
IE=EmulateIE7: 遵循DOCTYPE(有DOCTYPE-IE7標準；無DOCTYPE-IE5怪異模式)
IE=EmulateIE8：遵循DOCTYPE(DOCTYPE-IE8幾乎標準，或IE8標準；無DOCTYPE-IE5怪異模式)
IE=8、IE=Edge、IE=99、IE=9.9(大于等于8的)：有doctype-使用幾乎標準模式(或IE8標準)；無doctype-IE8標準。
注：設(shè)置了X-UA-Compatible(meta或http header)后，會覆蓋客戶端的兼容性視圖設(shè)置。會強迫(優(yōu)先)使用X-UA-Compatible設(shè)置的模式
無X-UA-Compatible、IE=IE8、IE=IE7、IE=a、還有上面注5里面提到的：首先判斷"兼容性視圖"，有"兼容性視圖"的設(shè)置(doctype-IE7標準，無doctype-IE5怪異模式)；未設(shè)置"兼容性視圖"，有DOCTYPE-遵循doctype，無doctype-IE5怪異模式。
IE9有7種模式: IE5.5怪異模式、IE7標準模式、IE8幾乎標準模式、IE8標準模式、IE9幾乎標準模式、IE9標準模式、XML模式
IE9和IE8大體上差不多：
X-UA-Compatible
IE=(0<= 值 <7) - 觸發(fā)怪異模式(無論頁面是否有DOCTYPE)，注：這里的怪異模式和IE8下的有點不同，測試發(fā)現(xiàn)"-"、"_"這兩個css hack符號，IE8怪異下是都識別的，IE9怪異下不識別"-"。
IE=7(7<= 值 <8) - 強制IE7標準(無論頁面是否有DOCTYPE)
IE=8(8<= 值 <9) - 強制IE8標準，有doctype-使用IE8幾乎標準模式(或IE8標準)，無doctype-IE8標準
IE=EmulateIE7、EmulateIE8 和上面IE8的情況一樣
IE=9、IE=Edge(值 >=9 ) - 有doctype-使用幾乎標準模式(或IE9標準)。和IE8一樣，靠doctype來選擇IE9幾乎標準，或IE9標準模式；無doctype-IE9標準。
IE=(值 <0)、IE=IE8、IE=IE7、IE=IE6、IE=a、IE=b、IE=bcd、IE=xxx類似這樣不靠譜的、或把X-UA-Compatible meta寫在<link>或<script>標簽后的，這些情況和無X-UA-Compatible是一樣的：首先判斷"兼容性視圖"，有"兼容性視圖"的設(shè)置(doctype-IE7標準，無doctype-怪異模式)；未設(shè)置"兼容性視圖"，有DOCTYPE-遵循doctype，無doctype-怪異模式。
X-UA-Compatible的特殊寫法
msdn上面提到了X-UA-Compatible值設(shè)置成"IE=9; IE=8; IE=5"這樣的，意思就是優(yōu)先最前面的IE9，沒IE9就用IE8，沒IE8就IE5，并且并不推薦在生產(chǎn)環(huán)境下使用。
觸發(fā)Google Chrome Frame：<meta http-equiv="X-UA-Compatible" content="chrome=1">
可以和IE的X-UA-Compatible混搭：比如：<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">。這樣寫的好處：可以讓ie在最好的渲染方式下渲染頁面。
"IE=edge,chrome=1"，可以寫成"chrome=1,IE=edge"、"chrome=1; IE=edge"。
幾乎標準模式（Almost Standards Mode）
Firefox 1+、Safari、Chrome、Opera(從7.5開始)和IE8/IE9增加了一個"幾乎標準模式"，它實現(xiàn)傳統(tǒng)的表格單元格的垂直尺寸(沒有嚴格的遵照CSS2規(guī)范)。
意思就是，比如下面的代碼：
<table style="border:1px solid blue;" cellspacing="0"> < tr><td><img style="border:1px solid red" width="364" height="126" src="http://www.google.com/images/logos/ps_logo2.png"/></td></tr> < /table>
比如在IE7標準模式下，圖片底部和table是沒空白的；"幾乎標準模式"下，圖片底部和table也是沒空白的；而較新的瀏覽器在標準模式下圖片底部和table會有個空白。
@see：https://developer.mozilla.org/en/Images,_Tables,_and_Mysterious_Gaps
下面的DOCTYPE都可觸發(fā)IE8標準模式：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> < !DOCTYPE html>
觸發(fā)IE8幾乎標準模式：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Mac IE5、IE6/7、Opera(<7.5)和Konqueror無幾乎標準模式(它們沒有嚴格遵循CSS2規(guī)范，實際上，它們的標準模式更接近幾乎標準模式)。HTML5把這種模式叫“受限怪異模式(limited quirks mode)”。
XML模式 - application/xhtml+xml Content
Firefox、Safari、Chrome和Opera中，HTTP頭設(shè)置了MIME-type(Content-Type為application/xhtml+xml時)，會觸發(fā)XML模式。在XML模式中，瀏覽器會嚴格地以XML解析XHTML文檔(很嚴格，用過W3C的xhtml驗證的同學應(yīng)該明白,比如"&"要用"&"+"amp;"、
要用 <br />)。
任何一個XHTML文檔的解析錯誤會導致停止解析,FF/SF/CH/OP會直接報XML解析錯誤，IE9可以在開發(fā)人員工具的console里面看到報錯。
MacIE5、IE6/7/8不支持application/xhtml+xml。
發(fā)現(xiàn)IE9下使用此模式，doctype是無所謂的，<html xmlns="http://www.w3.org/1999/xhtml"> 這句命名空間必須的，沒設(shè)置命名空間css會以文本解析而失效。
同時XML模式下，X-UA-Compatible的設(shè)置將會無效。
總結(jié)：
X-UA-Compatible只有IE>=8才識別，所以他們可以用doctype聲明、X-UA-Compatible、兼容性視圖設(shè)置來改變模式。
IE6/7卻依靠DOCTYPE來改變標準或怪異模式，類似這些低版本的瀏覽器下的標準模式，接近與“先進”瀏覽器下的幾乎標準模式，因為它們都沒有嚴格遵循CSS2規(guī)范。并且他們同樣在標準模式下，各自的渲染還是是有差別的。沒差別就不會有css hack的誕生。
IE6-IE9下，怪異模式都在IE5.5下。
不需要寫X-UA-Compatible，用css也完全可以搞定各個版本IE的解析不同。
模式、版本不同，不僅僅css解析不同，js的解析也有不同。
了解瀏覽器解析模式的不同，可以避免我們辛苦寫出的標準代碼被怪異所殘害。
讓開發(fā)者更注重遵循標準，無論在生產(chǎn)效率還是在協(xié)作、溝通上都有好處滴。
現(xiàn)在幾乎人人都用標準的doctype來聲明文檔，所以糾結(jié)標準、怪異模式對工作的影響不太大。
聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
Copyright ? 2019-2024 51dongshi.com 版權(quán)所有
違法及侵權(quán)請聯(lián)系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市萬商天勤律師事務(wù)所王興未律師提供法律服務(wù)
