ie6將元素懸停
.ie6 {
top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat')
? documentElement.scrollTop +(documentElement.clientHeight-this.clientHeight-20)
: document.body.scrollTop +(document.body.clientHeight-this.clientHeight-20)); /*底端*/
top: expression(eval(document.documentElement.scrollTop));/*頂端*/
}
ie6 png透明兼容
//除ie6
.face1Bg{background:url(images/1.png) no-repeat !important;}
//兼容ie6
.face1Bg{*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,src="images/1.png") !important;*background:none !important;}
IE系列:
div { +property:value; } 在屬性名前加上加號”+”,這個Hack只有IE系列可以識別.
div { *property:value; } 在屬性名前加上星號”*”,這個Hack只有IE系列可以識別.
div { _property:value; } 在屬性名前加上下劃線”_”,這個Hack只有IE6 識別.
background-color:red\0; /* ie 8/9*/
background-color:blue\9\0; /* ie 9*/
IE的if條件Hack
<!–[if IE]>Only IE <![endif]–> \\所有的IE可識別
<!–[if IE 5.0]> Only IE 5.0 <![endif]–> \\只有IE5.0可以識別
<!–[if gt IE 5.0]> Only IE 5.0+ <![endif]–> \\IE5.0包換IE5.5都可以識別
<!–[if lt IE 6]> Only IE 6- <![endif]–> \\僅IE6可識別
<!–[if gte IE 6]> Only IE 6/+ <![endif]–>\\ IE6以及IE6以下的IE5.x都可識別
<!–[if lte IE 7]> Only IE 7/- <![endif]–>\\ 僅IE7可識別
Firefox:
*:lang(lang) div { property:value !important; } 用僞類lang(語言)再加上!important進行定義的話,目前只有Firefox可以識別.
div, x:-moz-any-link { property:value; } 目前只有Firefox可以識別.
Safari:
div:empty { property:value !important; } 用僞類empty再加上!important進行定義的話,目前只有Safari可以識別.
Opera:
@media all and (min-width: 0px){ div { property:value; } } 利用特殊繼承法進行定義的話,目前只有Opera可以識別.
由於萬惡的IE（尤其指IE6和IE7），我們在頁面重構時不免要對其進行各種bug修復及差異化處理。在標準瀏覽器[1]中可實現的效果在IE裏卻有各種離奇問題，例如IE6、IE7不能良好應對的inline-block和.clearfix問題，好在大部分問題已經有了足夠的總結和途徑。廢話不多說，下面是一些方法區分瀏覽器的方法和我的看法。
主要途徑CSS Hack
直接在CSS文件中寫CSS Hack是非常直觀的區分方法。區分不同IE版本的hack代碼爲
#content{ background:red; /* 所有瀏覽器 */ background:orange\9; /* 所有IE瀏覽器 */ *background:yellow; /* IE7和IE6 */ +background:green; /* IE7 */ _background:blue; /* IE6 */ }
還有一些hack不太實用，就不一一列舉了。
CSS Hack的缺點是CSS文件無法通過W3C驗證，代碼閱讀時會很奇怪。
條件註釋CSS文件
條件註釋是寫在html裏的只會被IE識別的代碼，一般在<head>區域通過不同的條件註釋導入不同的CSS，不同的IE瀏覽器會引用不同的CSS。下面的4段註釋依次表示"在IE下使用"、“低於IE8時使用”、“IE7時使用”、“IE6時使用”：
<!--[if IE]> <link rel="stylesheet" href="/ie-all.css" type="text/css" media="screen" /> <![endif]--> <!--[if lt IE 8]> <link rel="stylesheet" href="/ie.css" type="text/css" media="screen" /> <![endif]--> <!--[if IE 7]> <link rel="stylesheet" href="/ie7.css" type="text/css" media="screen" /> <![endif]--> <!--[if IE 6]> <link rel="stylesheet" href="/ie6.css" type="text/css" media="screen" /> <![endif]-->
由於IE8下CSS問題較少，一般只需要爲IE6、7寫一點修正代碼。如果需要，可以在ie.css裏用CSS Hack對IE6/7進行差異處理。
<!--[if lt IE 8]> <link rel="stylesheet" href="/ie.css" type="text/css" media="screen" /> <![endif]-->
條件註釋CSS文件的缺點是會增加至少1次http請求，影響渲染速度，而且維護時不夠方便。
條件註釋<html>
條件註釋<html>跟上面的方法原理一樣，只不過這裏是給<html>註釋不同的class。
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]--> <!--[if IE 7 ]> <html class="ie7"> <![endif]--> <!--[if IE 8 ]> <html class="ie8"> <![endif]--> <!--[if IE 9 ]> <html class="ie9"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->
這樣在CSS中使用下面的代碼即可區分版本
#content{background:red;} .ie9 #content{background:orange;} .ie8 #content{background:yellow;} .ie7 #content{background:green;} .ie6 #content{background:blue;}
你也可以增加諸如.ltie8這樣的class來實現更方便的版本分組管理。這個方法不會增加http請求，而且不需要任何hack。
最佳方法
毫無疑問，最好的辦法就是用條件註釋<html>爲CSS提供區分。所有CSS文件可以合併在一起，ie的fix代碼與正常規則臨近，便於維護，而且沒有hack可以讓代碼符合標準（使用zoom、私有CSS3屬性依舊無法通過驗證T_T）。
標準瀏覽器[1]：本文指Chrome、Safari、Firefox及Opera等支持CSS標準屬性的瀏覽器。
http://lightcss.com/best-way-to-different-browser-for-css/區分IE6、IE7、IE8及標準瀏覽器——條件註釋<html>