标签:style io ar color sp strong on div 问题
建议:以标准浏览器为准书写代码,如遇到兼容问题,尝试其他方法解决问题,在万不得已怕情况下,采用HACK解决。
以下是我总结的HACK书写方法:
浏览器:仅限IE6+,FF,safari,chrome,opera;(截止到2011.10.12非IE均为最新版本)。
测试环境:windows系统;
DOCTYPE:.
标志符 | 示例 | IE6 | IE7 | IE8 | IE9 | FF | OP | SA | CH |
---|---|---|---|---|---|---|---|---|---|
* | .eq {*color:#000;} | Y | Y | N | N | N | N | N | N |
_ | .eq {_color:#000;} | Y | N | N | N | N | N | N | N |
+ | .eq {+color:#000;} | Y | Y | N | N | N | N | N | N |
- | .eq {-color:#000;} | Y | N | N | N | N | N | N | N |
> | .eq {>color:#000;} | Y | Y | N | N | N | N | N | N |
\0 | .eq {color:#000\0;} | N | N | Y | Y | N | Y | N | N |
\9 | .eq {color:#000\9;} | Y | Y | Y | Y | N | N | N | N |
\9\0 | .eq {color:#000\0;} | N | N | N\Y | Y | N | N | N | N |
:root .xx{xxx:xxx\9;} | :root .eq {color:#a00\9;} | N | N | N | Y | N | N | N | N |
*+ | .eq {*+color:#000;} | Y | Y | N | N | N | N | N | N |
*- | .eq {*-color:#000;} | Y | N | N | N | N | N | N | N |
*html | *html .eq {color:#000;} | Y | N | N | N | N | N | N | N |
*+html | *+html .eq {color:#000;} | N | Y | N | N | N | N | N | N |
html* | html* .eq {color:#000;} | Y | Y | N | N | N | N | N | N |
[; | .eq {color:red;[;color:blue;} | Y | Y | N | N | N | N | Y | Y |
html>body | html>body .eq {color:blue;} | N | Y | Y | Y | Y | Y | Y | Y |
html>/**/body | html>/**/body .eq {color:blue;} | N | N | Y | Y | Y | Y | Y | Y |
html/**/>body | html/**/>body .eq {color:blue;} | N | Y | Y | Y | Y | Y | Y | Y |
@media all and (min-width:0px){} | @media all and (min-width:0px){.eq {color:#000;}} | N | N | N | Y | Y | Y | Y | Y |
*:first-child+html | *:first-child+html .eq {color:blue;} | N | Y | N | N | N | N | N | N |
*:first-child+html{} *html | *:first-child+html{} *html .eq {color:blue;} | Y | N | N | N | N | N | N | N |
@-moz-document url-prefix(){} | @-moz-document url-prefix(){ .eq {color:blue;}} | N | N | N | N | Y | N | N | N |
@media screen and (-webkit-min-device-pixel-ratio:0){} | @media screen and (-webkit-min-device-pixel-ratio:0){.eq {color:blue;}} | N | N | N | N | N | N | Y | Y |
@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;}} | N | N | N | N | N | Y | N | N |
body:nth-of-type(1) | body:nth-of-type(1) .eq {color:blue;} | N | N | N | Y | Y | Y | Y | Y |
FF:firefox; OP:opera; SA:safari; CH:chrome; Y代表支持,N代表不支持。
.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专属*/
标签:style io ar color sp strong on div 问题
原文地址:http://www.cnblogs.com/eaysun/p/4109444.html