IE 8兼容: X-UA-Compatible的解釋

  前言:9月份開始了,大四也真正的到來了。深知本身網頁佈局還有很大的缺陷,接下來打算從工做中抽時間出來模仿着一些互聯網公司的網站。順便把基礎理論知識打好。html

  第一個目標:小米官網;後續會把練習的項目放到github上。git

  日常本身寫代碼不是很規範,網頁最基礎的架構<html></html>通常用的就是DW生成的頁面文件。前不久經老大調教,就改用了H5的框架結構。以前對於結構這塊沒有去想太多,就覺得是一個基本要求的結構。今天看小米首頁的活動頁,看到<meta http-equiv="X-UA-Compatible" content="IE=edge" />。以前看書的時候沒注意到這個,查過資料以後,瞭解到它實際上是指定瀏覽器按某種方式渲染。github

  如下爲轉載資料:chrome

  

對於IE8及以上版本,例如:瀏覽器

   1: <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />

 

強制瀏覽器按照特定的版本標準進行渲染。但不支持IE7及如下版本。若是用分號(;)分隔,對於不一樣的瀏覽器版本就有不一樣的兼容性,例如架構

   1: <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9" />

 

以上就代表,將IE8和IE7按照IE7標準渲染,可是IE9仍是按照IE9的標準渲染。它容許有不一樣的向後兼容水平。儘管在真實狀況中,你只要選擇一種版本:app

   1: <meta http-equiv="X-UA-Compatible" content="IE=8" />

 

 
這對於測試和維護會更加簡單。而一般更加有用的方式就是進行仿真模擬
   1: <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

 

對於IE=EDGE框架

   1: <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

 

這意味着,會強制瀏覽器按照最新的標準去渲染。就像在Google’s CDN使用最新版本的JQuery同樣,這是按照最新版本,但也可能因爲沒有固定的版本而破壞你的佈局。佈局

最後,考慮下面這個測試

   1: <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />

 

添加」chrome=1「將容許站點在使用了谷歌瀏覽器內嵌框架(Chrome Frame)的客戶端渲染,對於沒有使用的,則沒有任何影響。

For more information, there is plenty to read here, and if you want to learn about ChromeFrame (which I recommend) you can learn about its implementation here.

 

PS:X-UA-Compatible是針對 IE8 版本的一個特殊文件頭標記,用於爲 IE8 指定不一樣的頁面渲染模式,對於ie8以外的瀏覽器是不識別的。

目前絕大多數網站都用<meta http-equiv=」X-UA-Compatible」 content=」IE=EmulateIE7″ >來做爲IE8的兼容方法。爲了不製做出的頁面在IE8下面出現錯誤,建議直接將IE8使用IE7進行渲染。也就是直接在頁面的header的meta標籤中加入以下代碼:

<meta http-equiv=」X-UA-Compatible」 content=」IE=7″ />

<meta http-equiv=」X-UA-Compatible」 content=」IE=EmulateIE7″ >

<meta http-equiv=」X-UA-Compatible」 content=」IE=EmulateIE8″ >

可是<meta http-equiv=」X-UA-Compatible」 content=」IE=EmulateIE7″ >仍然是首選。

StackOverFlow原連接;http://stackoverflow.com/questions/14611264/x-ua-compatible-content-ie-9-ie-8-ie-7-ie-edge?answertab=active#tab-top

 

轉載請註明:淡忘~淺思 » 【譯】IE 8兼容:X-UA-Compatible的解釋

相關文章
相關標籤/搜索