最近更新了谷歌浏览器，发现之前设置的谷歌浏览器-webkit-text-size-adjust:none，谷歌浏览器自V27.0版本以来一直不支持它，这直接导致了页面的混乱。今天，主流浏览器将CSS hack总结了一下，希望以后不要纠结类似的问题，如下:
众所周知，Hack是为不同的浏览器编写不同的CSS风格，使每个浏览器都能达到一致的渲染效果，然后为不同的浏览器编写不同的CSS CODE的过程称为CSS HACK，也叫写CSS Hack。然后将Hack放入浏览器特定的CSS文件中，让其合格的浏览器分析这些代码，如上述条件样式，我们将CSS 将Hack代码放入条件样式文件中，对符合条件的浏览器进行分析，对不符合的浏览器进行分析，从表面上达到所需的页面渲染效果。一般来说，使用CSS Hack将使用您的CSS代码部分失去功能，然后使用其原始CSS代码在条件风格的帮助下在某些浏览器中进行分析 Hack代码在符合条件的浏览器中替换原CSS代码。常见的是在IE6下使用，不具体说，我想大家都遇到过。让我们来看看所有浏览器都有什么Hack，换句话说，各种浏览器都能识别哪些CSS写法。
以下是我在每个浏览器下收集的Hack：
| 标志符 | 示例 | 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 |
注意事项：
1、一些HACK可能会因为每个浏览器的快速更新而发生变化，所以请注意。
2、[;这种方法会影响后续风格，不可取。
3、并非所有属性都能区分IE8和IE9。比如：background-color可以，但background不能，border也不能。所以在实际使用中要进行测试。
4、同时出现\0，*，_，建议在*和_前写\0。例如:color:red\0;*color:blue;_color:green;可行，否则IE7和IE6中的效果会失效。但border例外，可以放在前后。为了保险起见，还是放在前面。
方法一：
- IE6 hack：
- _background-color:#CDCDCD; /* ie 6*/
- IE7 hack：
- *background-color:#dddd00; /* ie 7*/
- IE8 hack：
- background-color:red \0; /* ie 8/9*/
- IE9 hack：
- background-color:blue \9\0;
- 火狐、漫游等高级浏览器通用：
- background-color:red!important;
注意写hack的顺序，其中：background-color:red\0;支持IE8和IE9；background-color:blue\9\0; 仅IE9支持；此外，background-color:#eeeeee\9;支持IE6-IE8的HACK，但IE8无法识别“*”和“_”的CSS HACK。
方法二：
- #text{color:orange;}
- #text{*color: white; } /* IE6 7, doesn’t work in IE8/9 as IE7 */
- #text{_color: red; } /* IE6 */
- #text{color: green\0; } /* IE8 9 */
- :root #text{color:pink\0; } /* IE9 */
IE9 和 IE8 以及其他版本的差异描述
background-color:blue; 所有浏览器都知道，这里用firefox；
background-color:red\9;所有ie浏览器都可以识别；
background-color:yellow\0; \0 是留给ie8的，最新版opera也知道，后面自己的hack写给opera认可，所以，\0我们认为是给ie8留的；
background-color:pink; ie7定了；
_background-color:orange; _特别留给神奇ie6；
:root #test { background-color:purple\9; } :root是给ie9的，一个版本在网上流传 :root #test { background- color:purple\0;}，新版opera也知道这一点，因此，经作者反复验证，ie9的独特特点是：root 选择符 {属性\9;}
@media all and (min-width:0px){ #test {background-color:black\0;} } 总是和ie抢着认\0的神奇opera，必须加\0，否则firefox，chrome，也知道safari。。。。
@media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }最后，这是浏览器新贵chrome和safari。
我们需要注意的浏览器:IE6有自己的内核、IE7、IE8、谷歌浏览器IE9（Chrome）、火狐（Mozilla Firefox）苹果浏览器（Safari）至于我们常用的360安全浏览器、搜狗高速浏览器、每日浏览器、腾讯TT、骄傲浏览器，百度浏览器，腾 讯QQ浏览器等都没有内核，计算机中安装的系统有自己的浏览器内核，因此只需与自己的内核浏览器兼容即可。
总结：
总之，随着浏览器的增加，兼容性问题也会增加，这也能充分体现web前端开发者的价值。
