讓你的網(wǎng)站IE8瀏覽自動(dòng)用IE7兼容模式
前言
為了幫助確保你的網(wǎng)頁(yè)在所有未來(lái)的IE版本都有一致的外觀,IE8引入了文件兼容性 。在IE6中引入一個(gè)增設(shè)的兼容性模式 , 文件兼容性使你能夠在IE呈現(xiàn)你的網(wǎng)頁(yè)時(shí)選擇特定編譯模式 。
新的IE為了確保網(wǎng)頁(yè)在未來(lái)的版本中都有一支的外觀,IE8引入了文件兼容性 。當(dāng)你引入一個(gè)增設(shè)的兼容性模式,
此文章說(shuō)明文件兼容性的必要性,列出現(xiàn)有版本IE能使用的文件兼容性模式并示范如何選擇特定的兼容性模式 。
了解文件兼容性的必要性
每個(gè)主要版本IE新增的功能都是為了讓瀏覽器更容易使用、增加安全性及更支持業(yè)界標(biāo)準(zhǔn) 。以這些作為IE的特色,其中一個(gè)風(fēng)險(xiǎn)就是舊版本網(wǎng)站無(wú)法正確的顯示 。
為了將這個(gè)風(fēng)險(xiǎn)降到最低 , IE6允許網(wǎng)頁(yè)開發(fā)人員選擇IE編譯和顯示他們網(wǎng)頁(yè)的方式 。Quirks mode為預(yù)設(shè),這會(huì)使頁(yè)面以舊版本瀏覽器的視點(diǎn)顯示,Standards mode(也稱為strict mode)特點(diǎn)是支持業(yè)界標(biāo)準(zhǔn)最為完善 。然而要利用這個(gè)增強(qiáng)的支持功能,網(wǎng)頁(yè)必須包含恰當(dāng)?shù)?DOCTYPE指令 。
若一個(gè)網(wǎng)頁(yè)沒(méi)有包含!DOCTYPE指令,IE6會(huì)將它以quirks mode顯示 。若網(wǎng)頁(yè)包含有效的!DOCTYPE指令但瀏覽器無(wú)法辨識(shí),IE6會(huì)將它以IE6 standards mode顯示 。因?yàn)樯贁?shù)網(wǎng)站已經(jīng)包含!DOCTYPE指令 , 兼容性模式的切換相當(dāng)成功 。這使網(wǎng)頁(yè)開發(fā)人員能選擇將他們的網(wǎng)頁(yè)轉(zhuǎn)移為standards mode的最佳時(shí)機(jī) 。
隨著時(shí)間經(jīng)過(guò),更多網(wǎng)站開始使用standards mode 。它們也開始使用IE6的特性和功能來(lái)檢測(cè)IE 。舉例來(lái)說(shuō),IE6不支持universal selector(即css之全局選擇器 * {}),一些網(wǎng)站便使用它來(lái)針對(duì)IE做特定的對(duì)應(yīng) 。
當(dāng) IE7增加了對(duì)全域選擇器的支持 , 那些依賴IE6特點(diǎn)的網(wǎng)站便無(wú)法偵測(cè)出這個(gè)新版本的瀏覽器 。因此那些針對(duì)IE的特定對(duì)應(yīng)無(wú)法應(yīng)用于IE7,造成這些網(wǎng)站便無(wú)法如他們預(yù)期的顯示 。由于!DOCTYPE只支持兩種兼容性模式,受到影響的網(wǎng)站擁有者被迫更新他們的網(wǎng)站使其能支持IE7 。
IE8 比之前的任何版本瀏覽器都更支持業(yè)界標(biāo)準(zhǔn),因此針對(duì)舊版本瀏覽器設(shè)計(jì)的網(wǎng)頁(yè)可能無(wú)法如預(yù)期般呈現(xiàn) 。為了幫助減輕所有問(wèn)題,IE8引入文件兼容性的概念,使你能選擇你的網(wǎng)頁(yè)設(shè)計(jì)要對(duì)應(yīng)的特定IE版本 。文件兼容性在IE8增加了一些新的模式 , 這些模式能告訴瀏覽器如何解析和編譯一個(gè)網(wǎng)頁(yè) 。若你的網(wǎng)頁(yè)無(wú)法在 ie8正確的顯示,你可以更新你的網(wǎng)站使它支持最新的網(wǎng)頁(yè)標(biāo)準(zhǔn)(優(yōu)先選項(xiàng))或在你的頁(yè)面上新增一個(gè)meta元素用于告訴IE8如何依照舊版本瀏覽器編譯你的頁(yè)面 。
這能讓你選擇將你的網(wǎng)站更新支持IE8新特點(diǎn)的時(shí)機(jī) 。
認(rèn)識(shí)文件兼容性模式
IE8支持幾種文件兼容性模式,它們具有不同的特性并影響內(nèi)容顯示的方式 。
Emulate IE8 mode指示IE使用!DOCTYPE指令來(lái)決定如何編譯內(nèi)容 。Standards mode指令會(huì)顯示成IE8 Standards mode而quirks mode會(huì)顯示成IE5 mode 。不同于IE8 mode , Emulate IE8 mode重視!DOCTYPE指令 。
Emulate IE7 mode指示IE使用!DOCTYPE指令來(lái)決定如何編譯內(nèi)容 。Standards mode指令會(huì)顯示成IE7 Standards mode而quirks mode會(huì)顯示成IE5 mode 。不同于IE7 mode,Emulate IE7 mode重視!DOCTYPE指令 。對(duì)于許多網(wǎng)頁(yè)來(lái)說(shuō)這是最推薦的兼容性模式 。
IE5 mode 編譯內(nèi)容如同IE7的quirks mode之顯示狀況,和IE5中顯示的非常類似 。
IE7 mode編譯內(nèi)容如同IE7的standards mode之顯示狀況,無(wú)論網(wǎng)頁(yè)是否含有!DOCTYPE指令 。
IE8 mode提供對(duì)業(yè)界標(biāo)準(zhǔn)的最高支持,包含 W3C Cascading Style Sheets Level 2.1 Specification和W3C Selectors API,并有限的支持 W3C Cascading Style Sheets Level 3 Specification (Working Draft) 。
Edge mode指示IE以目前可用的最高模式顯示內(nèi)容 。當(dāng)使用IE8時(shí)其等同于IE8 mode 。若(假定)未來(lái)放出支持更高兼容性模式的IE , 使用Edge mode的頁(yè)面會(huì)使用該版本能支持的最高模式來(lái)顯示內(nèi)容 。同樣的那些頁(yè)面在使用IE8瀏覽時(shí)仍會(huì)照常顯示 。
由于edge mode使用該IE版本所能支持的最高模式來(lái)顯示所瀏覽的網(wǎng)頁(yè)內(nèi)容,建議僅使用于測(cè)試頁(yè)及其他非商用頁(yè)面 。
指定文件兼容性模式
要為你的網(wǎng)頁(yè)指定文件模式,需要在你的網(wǎng)頁(yè)中使用meta元素放入X-UA-Compatible http-equiv 標(biāo)頭 。以下是指定為Emulate IE7 mode 兼容性之范例 。
html
head
!-- Mimic Internet Explorer 7 --
meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 /
titleMy Web Page/title
/head
body
pContent goes here./p
/body
/html
其內(nèi)容隨著指定的頁(yè)面模式而更改,當(dāng)要模擬IE7時(shí),指定IE=EmulateIE7,指定IE=5, IE=7, 或IE=8來(lái)選擇其中一種兼容性模式 。你也可以指定IE=edge來(lái)指示IE8使用它支持的最高模式 。
X-UA-compatible標(biāo)頭沒(méi)有大小寫之分 。然而除了title元素及其他的meta元素之外,它必須出現(xiàn)在網(wǎng)頁(yè)header節(jié)其它元素之前的位置 ,
設(shè)定網(wǎng)站服務(wù)器以指定預(yù)設(shè)兼容性模式
網(wǎng)站管理員可籍著為網(wǎng)站定義一個(gè)自訂標(biāo)頭來(lái)為他們的網(wǎng)站預(yù)設(shè)一個(gè)特定的文件兼容性模式 。這個(gè)特定的方法取決于你的網(wǎng)站服務(wù)器 。舉例來(lái)說(shuō),下列的web.config文件使Microsoft Internet Information Services (IIS)能定義一個(gè)自訂標(biāo)頭以自動(dòng)使用IE7 mode來(lái)編譯所有網(wǎng)頁(yè) 。
?xml version=1.0 encoding=utf-8?
configuration
system.webServer
httpProtocol
customHeaders
clear /
add name=X-UA-Compatible value=https://www.questions.com.cn/dnjc/IE=EmulateIE7 /
/customHeaders
/httpProtocol
/system.webServer
/configuration
若你已于網(wǎng)站服務(wù)器指定了一個(gè)預(yù)設(shè)的文件兼容性模式 , 你可以在個(gè)別頁(yè)面上指定不同的文件兼容性模式來(lái)蓋過(guò)它 。在網(wǎng)頁(yè)中指定的模式優(yōu)先權(quán)高于服務(wù)器中所指定的模式 。
請(qǐng)查閱你的網(wǎng)站服務(wù)器關(guān)于指定自訂標(biāo)頭的資訊,或看更多資料:
Implementing the META Switch on Apache
Implementing the META Switch on IIS
判定文件兼容性模式
要判定網(wǎng)頁(yè)使用IE8瀏覽時(shí)的文件兼容性模式,使用document object(文檔對(duì)象)的documentMode功能 。例如在IE8的網(wǎng)址列輸入下列程式碼會(huì)顯示目前頁(yè)面的文件模式 。
javascript:alert(document.documentMode);
documentMode功能會(huì)回傳一個(gè)數(shù)值對(duì)應(yīng)目前頁(yè)面的文件兼容性模式,舉例來(lái)說(shuō),若網(wǎng)頁(yè)指定為支持IE8模式,documentMode便會(huì)回傳值8 。
在IE6引入的compatMode功能不支持在IE8引入的documentMode功能 。目前使用compatMode建立的應(yīng)用程式還能在IE8中作用,但它們必須更新為使用documentMode 。
若你希望使用JavaScript判定一個(gè)文件的兼容性模式,引入下面范例的這段程式碼可支持舊版本的IE 。
engine = null;
if (window.navigator.appName == Microsoft Internet Explorer)
{
// This is an IE browser. What mode is the engine in?
if (document.documentMode) // IE8
engine = document.documentMode;
else // IE 5-7
{
engine = 5; // Assume quirks mode unless proven otherwise
if (document.compatMode)
{
if (document.compatMode == CSS1Compat)
engine = 7; // standards mode
}
}
// the engine variable now contains the document compatibility mode.
}
認(rèn)識(shí)內(nèi)容屬性值
內(nèi)容屬性值在接收到異于先前敘述的數(shù)值時(shí)是具有彈性的 。這能使你對(duì)于IE如何顯示你的網(wǎng)頁(yè)更有操控性 。舉例來(lái)說(shuō),你可以設(shè)定內(nèi)容屬性值為IE=7.5 。當(dāng)你這樣做的時(shí)候,IE嘗試將這個(gè)值轉(zhuǎn)換為version vector并選擇最接近的結(jié)果 。在這個(gè)例子中,IE會(huì)將其設(shè)定為IE7 mode 。下面的范例顯示該模式設(shè)定為其他值的狀況 。
meta http-equiv=X-UA-Compatible content=IE=4 !-- IE5 mode --
meta http-equiv=X-UA-Compatible content=IE=7.5 !-- IE7 mode --
meta http-equiv=X-UA-Compatible content=IE=100 !-- IE8 mode --
meta http-equiv=X-UA-Compatible content=IE=a !-- IE5 mode --
!-- This header mimics Internet Explorer 7 and uses
!DOCTYPE to determine how to display the Web page --
meta http-equiv=X-UA-Compatible content=IE=EmulateIE7
注意: 前面的范例顯示單獨(dú)的內(nèi)容值 。實(shí)際上IE只會(huì)執(zhí)行網(wǎng)頁(yè)中第一個(gè)X-UA-Compatible標(biāo)頭 。
你也可以使用內(nèi)容屬性來(lái)指定復(fù)數(shù)的文件兼容性模式,這能幫助確保你的網(wǎng)頁(yè)在未來(lái)的瀏覽器版本都能一致的顯示 。欲設(shè)定復(fù)數(shù)的文件模式,請(qǐng)?jiān)O(shè)定內(nèi)容屬性以判別你想使用的模式 。使用分號(hào)來(lái)分開各個(gè)模式 。
如果一個(gè)特定版本的IE支持所要求的兼容性模式多于一種,將採(cǎi)用列于標(biāo)頭內(nèi)容屬性中最高的可用模式 。你可以使用這個(gè)特性來(lái)排除特定的兼容性模式 , 雖然并不推薦這樣做 。舉例來(lái)說(shuō),下列標(biāo)頭即會(huì)排除IE7 mode 。
meta http-equiv=X-UA-Compatible content=IE=5; IE=8 /
結(jié)論
兼容性對(duì)于網(wǎng)頁(yè)設(shè)計(jì)師來(lái)說(shuō)是非常重要的顧慮 。雖然最好是可以建立一個(gè)完全不需依賴任何網(wǎng)頁(yè)瀏覽器特性或功能的網(wǎng)站 , 有時(shí)候這是不可能實(shí)現(xiàn)的 。文件兼容性模式便能將網(wǎng)頁(yè)限制在某個(gè)特定版本的IE中 。
使用X-UA-Compatible標(biāo)頭來(lái)指定你的頁(yè)面支持的IE版本 。使用document.documentMode判定頁(yè)面的兼容性模式 。
選擇支持某個(gè)特定版本的IE,你可以確保你的頁(yè)面在未來(lái)的瀏覽器版本中也能有顯示的一致性 。
1.meta http-equiv=X-UA-Compatible content=IE=5 /
像是使用了 Windows Internet Explorer 7 的 Quirks 模式,這與 Windows Internet Explorer 5 顯示內(nèi)容的方式很相似 。
2.meta http-equiv=X-UA-Compatible content=IE=7 /
無(wú)論頁(yè)面是否包含 !DOCTYPE 指令,都像是使用了 Windows Internet Explorer 7 的標(biāo)準(zhǔn)模式 。
3.meta http-equiv=X-UA-Compatible content=IE=8 /
4.meta http-equiv=X-UA-Compatible content=edge /
Edge 模式通知 Windows Internet Explorer 以最高級(jí)別的可用模式顯示內(nèi)容,這實(shí)際上破壞了鎖定模式 。
5.meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 /
EmulateIE7 模式通知 Windows Internet Explorer 使用 !DOCTYPE 指令確定如何呈現(xiàn)內(nèi)容 。標(biāo)準(zhǔn)模式指令以Windows Internet Explorer 7 標(biāo)準(zhǔn)模式顯示,而 Quirks 模式指令以 IE5 模式顯示 。與 IE7 模式不同,EmulateIE7 模式遵循 !DOCTYPE 指令 。對(duì)于多數(shù)網(wǎng)站來(lái)說(shuō),它是首選的兼容性模式 。
相關(guān)經(jīng)驗(yàn)推薦
- 如何讓div+css兼容ie6 ie7 ie8 ie9和FireFox Chrome等瀏覽器
- 讓IE6/IE7/IE8支持CSS3屬性的8種方法介紹
- win7系統(tǒng)IE瀏覽器提示網(wǎng)站還原錯(cuò)誤的原因及解決方法圖文教程
- 如何讓非IE瀏覽器也能正常瀏覽、操作銀行的網(wǎng)銀網(wǎng)頁(yè)?
- 迅捷CAD編輯器讓CAD中兩個(gè)圖形對(duì)齊的方法
- IE提示已阻止此網(wǎng)站顯示有安全證書錯(cuò)誤的內(nèi)容的解決方法小結(jié)
- IE11怎么設(shè)置主頁(yè)將上網(wǎng)主頁(yè)改為百度或者網(wǎng)址導(dǎo)航網(wǎng)站
- 完美兼容ie和firefox的asp.net網(wǎng)站加入收藏和設(shè)置主頁(yè)
- Win10通過(guò)注冊(cè)表鎖定IE瀏覽器主頁(yè)讓其不能修改
- win10如何修改鎖定IE主頁(yè)不讓流氓軟件篡改IE主頁(yè)?
