html在ie個版本上的區別

時間 2020-07-19

標籤 html 版本區別欄目 HTML 简体版

原文原文鏈接

區分ff/ie6/ie7/ie8
注意下面介紹的這些hack寫法僅適用於XHTML1.0。若是沒有在HTML最前加上
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
那麼效果將不同！此外，這裏所說的IE8，不是指IE8的兼容模式，由於IE8的兼容模式其實就是IE7。html

selector{
property:value; // 全部瀏覽器
property:value\9; // 全部IE瀏覽器
+property:value; // IE7
_property:value; // IE6
}瀏覽器

區別IE六、7與FF/IE8：
background:blue;*background:orange;
引用
顯示效果：
IE 6/7：orange
FF/IE8:blue
原理：FF/IE8不支持*開頭，而IE6/7都支持。
*是標準瀏覽器如FF不支持的，ie8也不支持，可是IE5/6/7可以識別ide

區別IE6與IE7/IE8/FF：
background:green;_background:blue;
引用
顯示效果：
IE7/8/FF：green
IE6:blue
原理：IE6支持下劃線"_"，IE七、8和firefox均不支持下劃線。
版本小於IE6的IE瀏覽器可以識別_，可是其餘的瀏覽器，IE7/IE8/FF都不識別_網站

區別FF/IE8和IE6/7：
background:orange;+background:green;-background:blue;
或者
background:orange;*background:green!important;*background:blue;
引用
顯示效果：
IE6：blue
IE7：green
FF/IE8:orange
原理：IE6能識別-，IE7能識別+，IE8和FF都不能識別+和-
IE8/FF都不識別*，IE7優先識別!important，IE6不能識別!important。ui

區別FF/IE8/7和IE6：
body>p{color:#f00};
引用
顯示效果：
IE6：無色默認
IE7/8/FF:#f00
原理：body>p 支持IE7/8/FF，不支持IE6。firefox

區別IE6和IE7/FF：
selector{color:red!important;color:green;}
顯示效果：
IE6：green
IE7/8/FF:red
原理：IE6不識別!importent
      IE7識別!importent，而且!importent起到設置優先級的做用
      IE8識別!importent，而且!importent起到設置優先級的做用
      FF識別!importent，而且!importent起到設置優先級的做用xml

\9      p {color:#f00\9;}          支持 IE6/7/8         不支持FF
* html p {color:#f00;}            支持 IE6             不支持FF IE7 IE8b
*+html p {color:#f00;}            支持 IE7 IE8b        不支持FF IE6htm

IE都能識別*   標準瀏覽器(如FF)不能識別*
IE6能識別*    但不能識別 !important
IE7能識別*    也能識別!important
IE8不能識別* 但能識別!important
FF不能識別*   但能識別!importantget

關於IE8的hacks：
某外文網站上的解決方案，摘抄以下：
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
大意是：在 <head>中， <title>和任何 <meta>以前插入這個 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> ，這一行信息就告訴IE8將該頁面按照IE7的規則來處理！it

.test{
color:#00f\9; // IE8 only
color:#00f\9; // 適用於全部IE版本
}

可同時區分IE八、IE七、IE六、Firefox的CSS hacks：
.test{
    color:#000; // Firefox
    color:#00f\9; // IE8
    *color:#f00; // IE7
    _color:#0f0; // IE6
}

書寫順序爲FireFox在最前，其次是IE八、IE7，最後是IE6.
color:red;//全部瀏覽器
*color:blue\9;//全部IE
+color:orange;//IE7
_color:green;//IE6

若瀏覽器爲FireFox，那麼color:red；
若瀏覽器爲IE8，根據CSS優先性原則，color:blue；
若爲IE7，color:orange；
若爲IE6，則color:green。

對於* - + \9四個標籤來講 IE6識別 * 、_ IE7識別 * 、+ IE8識別 \9