再次发布关于IE6,IE7,IE8,Firefox兼容的css hack

已经发布过关于这CSS兼容的hack的文章不止一篇,可是有太多,都已经失效,再次发布,不想谈什么乱七八糟的理论,直接上实例!如下: 

IE浏览器都能识别“*” “\9”;标准浏览器(如FF)不能识别“*”;
IE6能识别“_” “+” “#” “@”, 同一属性有两个的只看后者 无论有没有 如果是两句它就能识别“!important”;
IE7能识别“+” “#” “@” “!important”,不能识别“_”;
FF能识别“!important”,不能识别“_” “+” “#” “@”;

 

以上是我自己测试的结果,如有差错还请指出~,或者你有好的兼容方法,请来我的博客www.chhua.com相互交流,把CSS兼容进行到底! 

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

例如:select{
Color:blue;//所有浏览器
Color:yellow\9;//所有IE浏览器
*Color:red;//forIE7
_color:green;//forIE6

关注过IE8的css hack的人相信大家都在使用这个hack,就是“9”的css hack: 

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

从上面测试结果我们可以看出“\0”的写法只被IE8识别,ie6,ie7都不能识别,那么“\0”应该是IE8的真正hack。主流浏览器的CSS hack这样更好一些: 

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

其中:OP表示Opera,SA表示Safari,Ch表示Chrome;

关注过IE8的css hack的人相信大家都在使用这个hack,就是“9”的css hack: 

.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支持 */
}
 

color:#0000FF\9的hack支持IE6-IE8(其他版本没有测试),但是IE8不能识别“*”和“_”的css hack,所以我们可以使用 

color:#0000FF\9; ;/*ie6,ie7,ie8*/ 

*color:#FFFF00;/*ie7*/ 

_color:#FF0000;/*ie6*/ 

来区分IE的各个版本。 

自由转载,转载请注明: 转载自WEB开发笔记 www.chhua.com

本文链接地址: 再次发布关于IE6,IE7,IE8,Firefox兼容的css hack (CSS浏览器兼容必看) http://www.chhua.com/web-note762

相关笔记

更多