微信公众号

IE8的CSS HACK--\9

web前端888914年前 (2011-03-12)

关注过IE8的css hack的人相信大家都在使用这个hack，就是“\9”的css hack：代码如下：

[CODE] .test{ color:#000000; /* FF,OP支持 */ color:#0000FF\9; /* 所有IE浏览器(IE6+)支持；但是IE8不能识别“*”和“_”的css hack；所以我们可以这样写hack */ [color:#000000;color:#00FF00; /* SF,CH支持 */ *color:#FFFF00; /* IE7支持 */ _color:#FF0000; /* IE6支持 */ } [/CODE]

	IE6	IE7	IE8	FF	OP	SA,CH
\0	×	×	√	×	×	×
\1	×	×	×	×	×	×
\2	×	×	×	×	×	×
\3	×	×	×	×	×	×
\4	×	×	×	×	×	×
\5	×	×	×	×	×	×
\6	×	×	×	×	×	×
\7	×	×	×	×	×	×
\8	×	×	×	×	×	×
\9	√	√	√	×	×	×
\10	×	×	×	×	×	×
\11	×	×	×	×	×	×
\12	×	×	×	×	×	×

其中：OP表示Opera，SA表示Safari，Ch表示Chrome；从上面测试结果我们可以看出“\0”的写法只被IE8识别，ie6，ie7都不能识别，那么“\0”应该是IE8的真正hack。

主流浏览器的 CSS hack这样更好一些：

[CODE] .test{ color:#000000; /* FF,OP支持 */ color:#0000FF\0; /* IE8支持*/ [color:#000000;color:#00FF00; /* SF,CH支持 */ *color:#FFFF00; /* IE7支持 */ _color:#FF0000; /* IE6支持 */ } [/CODE]

其中：OP表示Opera，SA表示Safari，Ch表示Chrome；另外随着google Chrome和Safari浏览器的流行，找google Chrome和Safari CSS hack的人也不少。我也找了一下：

[CODE] body:nth-of-type(1) .CH{ color: #FF0000;/* 这是专门针对Chrome和Safari的CSS hack */ } [/CODE]

分享给朋友：