hack速查表

 2023-09-05 阅读 86 评论 0

摘要:建议:以标准浏览器为准书写代码,如遇到兼容问题,尝试其他方法解决问题,在万不得已怕情况下,采用HACK解决。 以下是我总结的HACK书写方法: 浏览器:仅限IE6+,FF,safari,chrome,opera;(截止到2011.10.12非IE均为最

建议:以标准浏览器为准书写代码,如遇到兼容问题,尝试其他方法解决问题,在万不得已怕情况下,采用HACK解决。

以下是我总结的HACK书写方法:

浏览器:仅限IE6+,FF,safari,chrome,opera;(截止到2011.10.12非IE均为最新版本)。

测试环境:windows系统;

DOCTYPE:.

标志符示例IE6IE7IE8IE9FFOPSACH
*.eq {*color:#000;}YYNNNNNN
_.eq {_color:#000;}YNNNNNNN
+.eq {+color:#000;}YYNNNNNN
-.eq {-color:#000;}YNNNNNNN
>.eq {>color:#000;}YYNNNNNN
\0.eq {color:#000\0;}NNYYNYNN
\9.eq {color:#000\9;}YYYYNNNN
\9\0.eq {color:#000\0;}NNN\YYNNNN
:root .xx{xxx:xxx\9;}:root .eq {color:#a00\9;}NNNYNNNN
*+.eq {*+color:#000;}YYNNNNNN
*-.eq {*-color:#000;}YNNNNNNN
*html*html .eq {color:#000;}YNNNNNNN
*+html*+html .eq {color:#000;}NYNNNNNN
html*html* .eq {color:#000;}YYNNNNNN
[;.eq {color:red;[;color:blue;}YYNNNNYY
html>bodyhtml>body .eq {color:blue;}NYYYYYYY
html>/**/bodyhtml>/**/body .eq {color:blue;}NNYYYYYY
html/**/>bodyhtml/**/>body .eq {color:blue;}NYYYYYYY
@media all and (min-width:0px){}@media all and (min-width:0px){.eq {color:#000;}}NNNYYYYY
*:first-child+html*:first-child+html .eq {color:blue;}NYNNNNNN
*:first-child+html{} *html*:first-child+html{} *html .eq {color:blue;}YNNNNNNN
@-moz-document url-prefix(){}@-moz-document url-prefix(){ .eq {color:blue;}}NNNNYNNN
@media screen and (-webkit-min-device-pixel-ratio:0){}@media screen and (-webkit-min-device-pixel-ratio:0){.eq {color:blue;}}NNNNNNYY
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0){}@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0){.eq {color:blue;}}NNNNNYNN
body:nth-of-type(1)body:nth-of-type(1) .eq {color:blue;}NNNYYYYY

FF:firefox; OP:opera; SA:safari; CH:chrome; Y代表支持,N代表不支持。

注意事项:

  • ·
    由于各浏览器更新神速,所以有些HACK可能会有变化,所以请大家注意。
  • ·
    [;此种方式会影响后续样式,不可取。
  • ·
    \9\0并非对所有属性都能区分IE8和IE9.比如:background-color可以,但background不可以,还有border也不可以。所以在实际用时要测试下。
  • ·
    当同时出现\0;*;_;时,推荐将\0写在*和_前面。例如:color:red\0;*color:blue;_color:green;可行,否则IE7和IE6里的效果会失效。但border例外,放在前后都可以。保险起见,还是放在前面。

推荐写法:

demo:

        .eq {color:#f00;/*标准浏览器*/color:#f30\0;/*IE8,IE9,opera*/*color:#c00;/*IE7及IE6*/_color:#600;/*IE6专属*/}:root .eq {color:#a00\9;}/*IE9专属*/@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0){.eq {color:#450;}}/*opera专属*/@media screen and (-webkit-min-device-pixel-ratio:0){.eq {color:#879;}}/*webkit专属*/@-moz-document url-prefix(){ .eq {color:#4dd;}}/*firefox专属*/

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://808629.com/218.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 86后生记录生活 Inc. 保留所有权利。

底部版权信息