CSS Hack总结说明

Css hack 总结说明

1. 常见CSS Hack

(1)区别不同浏览器，CSS hack写法：

区别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	×	√	√

另外再补充一个，下划线"_",
IE6支持下划线，IE7和firefox均不支持下划线。

于是大家还可以这样来区分IE6，IE7，firefox
: background:orange;*background:green;_background:blue;

注：不管是什么方法，书写的顺序都是firefox的写在前面，IE7的写在中间，IE6的写在最后面。

(2)区别不同浏览器，CSS hack写法：

.classname{} ff

*html .classname{} IE6

*+html .classname{} IE7

(3)补充区分IE8

\9"　例:"margin:0px auto\9;".这里的"\9"可以区别所有IE和FireFox.
"*"　IE6、IE7可以识别.IE8、FireFox不能.
"_"　IE6可以识别"_",IE7、IE8、FireFox不能.

\0" 只有IE8浏览器能够识别。

其中：OP表示Opera，SA表示Safari，Ch表示Chrome；当然你如果还有耐心可以测试“\14”，“\15”，“\16”。。。

综上所述，区别IE6、IE7、IE8、FireFox的CSS hack完整写法如下：

.color{
background-color: #CC00FF; /*所有浏览器都会显示为紫色*/
background-color: #FF0000\9; /*IE6、IE7、IE8会显示红色*/
*background-color: #0066FF; /*IE6、IE7会变为蓝色*/
_background-color: #009933; /*IE6会变为绿色*/
}

CSS Hack是我们不到万不得已使用的方法，我们在使用时要特别的注意，如果非得使用CSS hack,我建议大家使用如上方式。

区分Google、Safari 3.0、Opera 9浏览器：

@media screen and (-webkit-min-device-pixel-ratio:0)

{

.color{}

}