1:條件級別
語法 :<!--[if IE]> 執行內容 包括css和html<![endif]-->
------放到css中:---------
<!--[if IE]>
<style>
p{color:color} // 如果是ie瀏覽器 顏色是紅的
</style>
<![endif]-->
------放到html中:---------
<!--[if IE]>
<p>如果是IE流浪器則執行該代碼的<p>
<![endif]-->
<!--[if <keywords>? IE <version>?]>
HTML代碼塊
<![endif]-->
有六種取值空間
是否 ‘空’、大於 ‘gt’、大於等於 ‘gte’、小於 ‘lt’、小於等於 ‘lte’、非指定版本 ‘!’
<!--[if gt IE 6]>
<style>
p{color:color} // 如果ie瀏覽器 大於IE6 時 顏色是紅的
</style>
<![endif]-->
<!--[if gte IE 6]>
<style>
p{color:blue} // 如果ie瀏覽器 大於等於IE6 時 顏色是藍色的
</style>
<![endif]-->
2:屬性級別
語法:
selector{<hack>?property:value<hack>?;}
取值區間:
_ 下划線:屬性前面加下划線_ 適應 IE6 以及IE6 以下版本(-連接線 中划線也可以,但是為了避免與屬性混淆 建議使用下划線_)
* 星號:屬性前面加星號*, 適用於IE7 及以下版本
\9 :IE6 及以上版本
\0 :IE8 及以上和Opera15以下的瀏覽器
<style>
.test1{
_color:red;
}
.test2{
*color:green;
}
.test3{
color:blue\9;
}
</style>
<body>
<!--[if IE]>
<div>是IE瀏覽器<div>
<![endif]-->
<p>非IE瀏覽器</p>
<div class="test1">我是IE6 及以下的版本 顏色是紅的</div>
<div class="test2">我是IE7 及以下的版本 顏色是green的</div>
<div class="test3">我是IE6 及以上的版本 顏色是blue的</div>
</body>
3:選擇操作符級別
語法:
<hack> selector{ sRules }
選擇不同的瀏覽器及版本
盡可能減少對CSS Hack的使用。Hack有風險,使用需謹慎
通常如未作特別說明,本文檔所有的代碼和示例的默認運行環境都為標准模式。
一些CSS Hack由於瀏覽器存在交叉認識,所以需要通過層層覆蓋的方式來實現對不同瀏覽器進行Hack的。
簡單列舉幾個:
* html .test { color: #090; } /* For IE6 and earlier */
* + html .test { color: #ff0; } /* For IE7 */
.test:lang(zh-cmn-Hans) { color: #f00; } /* For IE8+ and not IE */
.test:nth-child(1) { color: #0ff; } /* For IE9+ and not IE */