IE常見的兼容處理

時間 2019-12-11

標籤常見的兼容處理简体版

原文原文鏈接

IE常見的兼容處理

　　1. 禁用IE兼容模式css

　　　　爲了保證IE可以使用最新渲染模式而不是兼容模式，在html文檔頭部應加入如下代碼：html

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  ...

　　2. 提示IE7及更早版本的用戶html5

　　　針對IE7及更早的版本，應該給出提示，讓用戶升級瀏覽器。在body以後加入如下代碼能夠有選擇性的出現瀏覽器升級提示，並給出連接引導用戶訪問browsehappy.com：css3

<body>
  <!--[if lt IE 8]>
    <div class="alert alert-danger">您正在使用 <strong>過期的</strong> 瀏覽器. 是時候 <a href="http://browsehappy.com/">更換一個更好的瀏覽器</a> 來提高用戶體驗.</div>
  <![endif]-->
  ...

　　　　若是你準備支持的IE瀏覽器最低版本爲IE9，也建議爲早期用戶準備一個提示，只須要將以上代碼中的 [if lt IE 8] 更改成 [if lt IE 9]。web

　　3. IE8用戶　（須要的文件能夠本身百度到）　　canvas

　　　　由於IE8及早期版本不支持HTML5標籤，因此針對IE8瀏覽器，咱們引入html5shiv來使得HTML5標籤在IE8中也能使用。在HTML文檔的script區域加入如下代碼：瀏覽器

<!--[if lt IE 9]>
  <script src="html5shiv.js"></script>
<![endif]-->

　　　　由於IE8及早期版本一樣不支持media query來實現響應式佈局，咱們一樣能夠經過條件註釋引入respond.js來幫助ie實現該功能。app

<!--[if lt IE 9]>
  <script src="respond.js"></script>
<![endif]-->

　　　　由於IE8及早期版本不支持Canvas，若是你的產品用到圖表視圖，則須要引入 ExplorerCanvas 來支持繪圖功能。佈局

<!--[if lt IE 9]>
  <script src="excanvas.js"></script>
<![endif]-->

　4. 低版本IEcss3支持CSS3部分屬性（PIE.htc）
ui

下載地址： http://css3pie.com

　　　　用 PIE.htc 來讓IE瀏覽器支持CSS3的 border-radius、box-shadow、CSS3 Backgrounds (-pie-background)、Gradients、RGBA屬性。

　　　　要使用 PIE 應用就要先把它引進來，這裏不是在 html 文件裏面引入，而是在 css 文件裏面使用 behavior 來對文件進行導入。

　　　注：PIE.htc URL路徑是相對於當前HTML文件，而不是CSS文件.

.borderRadius{
         border-radius: 10px;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         background: #ABCDEF;
         behavior: url(css/PIE.htc);
}

　　　　使用詳情請參考： https://www.jianshu.com/p/b18cbc3e6b64

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。