兼容IE6/IE7/IE8/FireFox的css hack
作者：未知 來源：不詳 發(fā)布時間：2015/12/12 16:13:39
1 2 3 4 5 6 | .color{ background-color: #CC00FF; background-color: #FF00009; *background-color: #0066FF; _background-color: #009933; } |
**記住上面得樣式解釋為順序是 ff、ie8、ie7、ie6 ** 顯示的結果： 用火狐瀏覽，顏色是紫色 用 IE8 瀏覽，顏色是紅色 用 IE7 瀏覽，顏色是藍色 用 IE6 瀏覽，顏色是綠色
IE8 最新css hack： "" 例:"margin:0px auto;".這里的""可以區(qū)別所有IE和FireFox. "9" 例:"margin:0px auto9;".這里的"9"可以區(qū)別所有IE和FireFox. "*" IE6、IE7可以識別.IE8、FireFox不能. "_" IE6可以識別"_",IE7、IE8、FireFox不能.
一些IE6 IE7 IE8 FF的CSS hack
1 2 3 4 5 6 | p{+color:#f00;} 支持 IE6 IE7 不支持FF IE8p{_color:#f00;} 支持 IE6 不支持FFp{color:#00f !important;}p{color:#f00;} 支持 IE7 IE6 FF IE8p{color:#00f !important;color:#f00;} 支持 IE7 IE8 FF 不支持 IE6head:first-child+body p{color:#f00;} 支持 IE7 IE8 FF 不支持 IE6 |
各瀏覽器CSS hack兼容表：
| IE6 | IE7 | IE8 | Firefox | Chrome | Safari | |
| !important | Y | Y | ||||
| _ | Y | |||||
| * | Y | Y | ||||
| *+ | Y | |||||
| 9 | Y | Y | Y | |||
| Y | ||||||
| nth-of-type(1) | Y | Y |
小知識：什么是CSS hack？
由于不同的瀏覽器，比如IE6、IE7、IE8、Firefox等，對CSS的解析認識不一樣，因此會導致生成的頁面效果不一樣，得不到我們所需要的頁面效果。
這個時候我們就需要針對不同的瀏覽器去寫不同的CSS，讓它能夠同時兼容不同的瀏覽器，能在不同的瀏覽器中也能得到我們想要的頁面效果。
這個針對不同的瀏覽器寫不同的CSS code的過程，就叫CSS hack，也叫寫CSS hack。
下一篇：CSS3中新出現(xiàn)的技術元素
