前言

每次要找個(gè)東西都得慢慢去翻自己收集的一些東西,每次都是那么花時(shí)間,再加上有時(shí)存放時(shí)間久遠就忘了當時(shí)是存在哪了,為了方便查詢(xún)及閱讀,決定把一些Css Hack 收集起來(lái)...

1.區別不同瀏覽器，CSS hack寫(xiě)法：

區別IE6與FF：background:orange;*background:blue;區別IE6與IE7：background:green !important;background:blue;區別IE7與FF：background:orange; *background:green;區別FF，IE7，IE6：background:orange;*background:green !important;*background:blue;注：IE都能識別*;標準瀏覽器(如FF)不能識別*；IE6能識別*，但不能識別 !important,IE7能識別*，也能識別!important;FF不能識別*，但能識別!important;
    
        
            
 
            
IE6
            
IE7
            
FF
        
        
            
*
            
√
            
√
            
×
        
        
            
!important
            
×
            
√
            
√
        
    
另外再補充一個(gè)，下劃線(xiàn)"_",IE6支持下劃線(xiàn)，IE7和FF均不支持下劃線(xiàn)。于是大家還可以這樣來(lái)區分IE6，IE7，FF: background:orange;*background:green;_background:blue;注：不管是什么方法，書(shū)寫(xiě)的順序都是FF的寫(xiě)在前面，IE7的寫(xiě)在中間，IE6的寫(xiě)在最后面。

2.!important

隨著(zhù)IE7對!important的支持, !important 方法現在只針對IE6的HACK.(注意寫(xiě)法.記得該聲明位置需要提前.)<style>#wrapper{width: 100px!important; /* IE7+FF */width: 80px; /* IE6 */}</style>

3.IE6/IE7對FF

1.*+html 與 *html 是IE特有的標簽, firefox 暫不支持.而*+html 又為 IE7特有標簽.
<style>#wrapper{#wrapper { width: 120px; } /* FireFox */*html #wrapper { width: 80px;} /* ie6 fixed */*+html #wrapper { width: 60px;} /* ie7 fixed, 注意順序 */}</style>
2.表達方式：+property:value
測試環(huán)境：IE5，IE6 ，IE7，FF1.5，FF2.0，Opera 9，Safari 2測試結果：IE5，IE6 ，IE7瀏覽器識別；FF2.0，Opera 9，Safari 2瀏覽器不識別。結論：我們可以用"+"來(lái)實(shí)現只有IE識別的CSS Hack。比如我們要實(shí)現在IE中500px的寬度，而在其他瀏覽器480px的寬度，就可以通過(guò)"+" Hack來(lái)完成，如下：#hack {width:500px;+width:480px; /*only IE*/}
3.用于內聯(lián)css
##wrapper  {height:20px;   /*For Firefox*/*height:25px;  /*For IE7 & IE6*/_height:20px;  /*For IE6*/}
5.IE7的hack
>bodyhtml**+html這三種寫(xiě)法，其中前兩種都是不合法的 CSS 寫(xiě)法，在標準兼容瀏覽器中被被忽略，但是 IE7 卻不這么認為。 對于 >body ，它會(huì )將缺失的選擇符用全局選擇符 * 代替，也就是將其處理成了 *>body，而且不光對于 > 選擇符，+,~ 選擇符中這個(gè)現象也存在。對于 html* ，由于 html 和 * 之間沒(méi)有空格，所以也是一種 CSS 語(yǔ)法錯誤，但 IE7 不會(huì )忽略，而是錯誤地認為這里有一個(gè)空格。對于第三種 *+html，IE7 認為 html 前面的 DTD 聲明也是一個(gè)元素，所以 html 會(huì )被選中，這三種方法中只有這一種方法是合法的 CSS 寫(xiě)法，也就是說(shuō)可以通過(guò)校驗器的驗證，因此也是作者推薦的 hack 用法。 
6.IE6 不能識別
html/* */ >body  #box { color: red; }   IE6 字體不會(huì )變成紅色 
7.屏蔽IE瀏覽器（也就是IE下不顯示）
*:lang(zh) select {font:12px  !important;}/*FF,OP可見(jiàn)，特別提醒：由于Opera最近的升級，目前此句只為FF所識別*/select:empty {font:12px  !important;}/*safari可見(jiàn)*/這里select是選擇符，根據情況更換。第二句是MAC上safari瀏覽器獨有的。
8.僅IE7與IE5.0可以識別
*+html  select {…}當面臨需要只針對IE7與IE5.0做樣式的時(shí)候就可以采用這個(gè)HACK。 
9.僅IE7可以識別
*+html  select {…!important;}當面臨需要只針對IE7做樣式的時(shí)候就可以采用這個(gè)HACK。  
10.IE6及IE6以下識別
* html  select {…}這個(gè)地方要特別注意很多博客都寫(xiě)成了是IE6的HACK其實(shí)IE5.x同樣可以識別這個(gè)HACK。其它瀏覽器不識別。html/**/ >body  select {…}這句與上一句的作用相同。  
11.僅IE6不識別，屏蔽IE6
select { display /*屏蔽IE6*/:none;}這里主要是通過(guò)CSS注釋分開(kāi)一個(gè)屬性與值，注釋在冒號前。
12.僅IE6與IE5不識別，屏蔽IE6與IE5
select/**/ { display /*IE6,IE5不識別*/:none;}這里與上面一句不同的是在選擇符與花括號之間多了一個(gè)CSS注釋。不屏蔽IE5.5
13.僅IE5不識別，屏蔽IE5
select/*IE5不識別*/ {…}這一句是在上一句中去掉了屬性區的注釋。只有IE5不識別，IE5.5可以識別。
14.盒模型解決方法
select {width:IE5.x寬度; voice-family :"\"}\""; voice-family:inherit; width:正確寬度;}盒模型的清除方法不是通過(guò)!important來(lái)處理的。這點(diǎn)要明確。
15.盒模型解決方法
select:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}在Firefox中，當子級都為浮動(dòng)時(shí)，那么父級的高度就無(wú)法完全的包住整個(gè)子級，那么這時(shí)用這個(gè)清除浮動(dòng)的HACK來(lái)對父級做一次定義，那么就可以解決這個(gè)問(wèn)題。
16.只有Opera識別
@media all and (min-width: 0px){ select {……} }針對Opera瀏覽器做單獨的設定。
17.IE5.x的過(guò)濾器，只有IE5.x可見(jiàn)
@media tty {i{content:"\";/*" "*/}} @import ‘ie5win.css‘; /*";}}/* */
18.IE5/MAC的過(guò)濾器，一般用不著(zhù)
@media all and (min-width: 0px){ select {……} }針對Opera瀏覽器做單獨的設定。

以上內容并不全面，有些內容是從小毅那邊摘來(lái)的,有的是收集一段時(shí)間,已無(wú)從考證最初的出處,但是在此還是謝謝他們的無(wú)私的提供。

另:針對Safari的hack:
有用的 Safari Hack 技巧
另一個(gè) Safari CSS Hack 方法