IE6，IE7，IE8，Firefox兼容的css hack详解

作者：袖梨 2022-06-25

已经发布过关于这CSS兼容的hack的文章不止一篇，可是有太多，都已经失效，再次发布，不想谈什么乱七八糟的理论，直接上实例！如下：
IE浏览器都能识别“*” “＼9”;标准浏览器(如FF)不能识别“*”；
IE6能识别“_” “+” “#” “@”, 同一属性有两个的只看后者 无论有没有 如果是两句它就能识别“!important”;
IE7能识别“+” “#” “@” “!important”，不能识别“_”;
FF能识别“!important”，不能识别“_” “+” “#” “@”;
 
以上是我自己测试的结果，如有差错还请指出~，或者你有好的兼容方法，

注：不管是什么方法，书写的顺序都是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的各个版本。

最后带上微软在IE8提供三种解析页面的模式


　　IE8 Standard Modes ：默认的最标准的模式，严格按照W3C相关规定
　　IE7 Standards Modes ：IE7现在用的解析网页的模式，开起机关是在中加入
　　Quirks Modes ：IE5用的解析网页的模式，开起机关是删除HTML顶部的DOCTYPE声明
　　注意：不同模式间的网页在IE8中可以互相 frame ，因此因不会模式下的DOM和CSS渲染不一样，所以会引发很多问题，务必注意如果你的页面对IE7兼容没有问题，又不想大量修改现有代码，同时又能在IE8中正常使用，微软声称，开发商仅需要在目前兼容IE7的网站上添加一行代码即可解决问题，此代码如下：


 Example Source Code

　　IE8 最新css hack：


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

相关文章

精彩推荐