DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> IE8文件兼容性問題詳解(2)
IE8文件兼容性問題詳解(2)
編輯:CSS詳解     

指定IE8文件兼容性模式

要為你的網頁指定文件模式,需要在你的網頁中使用meta元素放入X-UA-Compatiblehttp-equiv標頭。以下是指定為EmulateIE7mode兼容性之范例。

  1. <Html>
  2. <head>
  3. <!--MimicInternetExplorer7-->
  4. <metahttp-equivmetahttp-equiv="X-UA-Compatible"content="IE=EmulateIE7"/>
  5. <title>MyWebPage</title>
  6. </head>
  7. <body>
  8. <p>Contentgoeshere.</p>
  9. </body>
  10. </Html>

其內容隨著指定的頁面模式而更改,當要模擬IE7時,指定IE=EmulateIE7,指定IE=5,IE=7,或IE=8來選擇其中一種兼容性模式。你也可以指定IE=edge來指示IE8使用它支持的最高模式。

X-UA-compatible標頭沒有大小寫之分。然而除了title元素及其他的meta元素之外,它必須出現在網頁header節其它元素之前的位置,

設定網站服務器以指定預設兼容性模式

網站管理員可籍著為網站定義一個自訂標頭來為他們的網站預設一個特定的IE8文件兼容性模式。這個特定的方法取決於你的網站服務器。舉例來說,下列的web.config文件使MicrosoftInternetInformationServices(IIS)能定義一個自訂標頭以自動使用IE7mode來編譯所有網頁。

  1. <?XMLversionXMLversion="1.0"encoding="utf-8"?>
  2. <configuration>
  3. <system.webServer>
  4. <httpProtocol>
  5. <customHeaders>
  6. <clear/>
  7. <addnameaddname="X-UA-Compatible"value="IE=EmulateIE7"/>
  8. </customHeaders>
  9. </httpProtocol>
  10. </system.webServer>
  11. </configuration>

若你已於網站服務器指定了一個預設的IE8文件兼容性模式,你可以在個別頁面上指定不同的IE8文件兼容性模式來蓋過它。在網頁中指定的模式優先權高於服務器中所指定的模式。

請查閱你的網站服務器關於指定自訂標頭的資訊,或看更多資料:

ImplementingtheMETASwitchonapache
ImplementingtheMETASwitchonIIS

判定IE8文件兼容性模式

要判定網頁使用IE8浏覽時的IE8文件兼容性模式,使用documentobject(文檔對象)的documentMode功能。例如在IE8的網址列輸入下列程式碼會顯示目前頁面的文件模式。

Javascript:alert(document.documentMode);
documentMode功能會回傳一個數值對應目前頁面的IE8文件兼容性模式,舉例來說,若網頁指定為支持IE8模式,documentMode便會回傳值"8"。

在IE6引入的compatMode功能不支持在IE8引入的documentMode功能。目前使用compatMode建立的應用程式還能在IE8中作用,但它們必須更新為使用documentMode。

若你希望使用JavaScript判定一個文件的兼容性模式,引入下面范例的這段程式碼可支持舊版本的IE。

  1. engine=null;
  2. if(window.navigator.appName=="MicrosoftInternetExplorer")
  3. {
  4. //ThisisanIEbrowser.Whatmodeistheenginein?
  5. if(document.documentMode)//IE8
  6. engine=document.documentMode;
  7. else//IE5-7
  8. {
  9. engine=5;//Assumequirksmodeunlessprovenotherwise
  10. if(document.compatMode)
  11. {
  12. if(document.compatMode=="CSS1Compat")
  13. engine=7;//standardsmode
  14. }
  15. }
  16. //theenginevariablenowcontainsthedocumentcompatibilitymode.
  17. }

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved