常用的css hack简单写法与兼容性介绍

区别不同浏览器的CSS hack写法：

区别IE6与FF：
        background:orange;*background:blue;

区别IE6与IE7：
        background:green !important;background:blue;

区别IE7与FF：
        background:orange; *background:green;

区别FF，IE7，IE6：
        background:orange;*background:green !important;*background:blue;

注：IE都能识别*;标准浏览器(如FF)不能识别*；

IE6能识别*，但不能识别 !important,
IE7能识别*，也能识别!important;
FF不能识别*，但能识别!important;

  IE6 IE7 FF
* √ √ ×
!important × √ √

------------------------------------------------------
另外再补充一个，下划线"_",
IE6支持下划线，IE7和firefox均不支持下划线。

  IE6 IE7 FF
* √ √ ×
!important × √ √
_ √ × ×

于是大家还可以这样来区分IE6，IE7，firefox
: background:orange;*background:green;_background:blue;

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

实例

上面这段代码大家可以直接copy出来，保存成html在各浏览器试试。下面我来分析下：
    background-color:blue; 各个浏览器都认识，这里给firefox用；
    background-color:red9;9所有的ie浏览器可识别；
    background-color:yellow; 是留给ie8的，但笔者测试，发现最新版opera也认识，汗。。。不过且慢，后面自有hack写了给opera认的，所以，我们就认为是给ie8留的；
    +background-color:pink; + ie7定了；
    _background-color:orange; _专门留给神奇的ie6；
    :root #test { background-color:purple9; } :root是给ie9的，网上流传了个版本是 :root #test { background-color:purple;}，呃。。。这个。。。，新版opera也认识，所以经笔者反复验证最终ie9特有的为:root 选择符 {属性9;}
    @media all and (min-width:0px){ #test {background-color:black;} } 这个是老是跟ie抢着认的神奇的opera，必须加个,不然firefox，chrome，safari也都认识。。。
    @media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }最后这个是浏览器新贵chrome和safari的。

下面再看一些常用的

.all-IE{property:value9;}
:root .IE-9{property:value/;}
.gte-IE-8{property:value;}
.lte-IE-7{*property:value;}
.IE-7{+property:value;}
.IE-6{_property:value;}
.not-IE{property//:value;}
@-moz-document url-prefix() { .firefox{property:value;} }
@media all and (-webkit-min-device-pixel-ratio:0) { .webkit{property:value;} }
@media all and (-webkit-min-device-pixel-ratio:10000),not all and (-webkit-min-device-pixel-ratio:0) { .opera{property:value;} }
@media screen and (max-device-width: 480px) { .iphone-or-mobile-s-webkit{property:value;} }

IE8 最新css hack： 　　"9"　例:"border:1px 9;".这里的"9"可以区别所有IE和FireFox. 　　""　IE8识别，IE6、IE7不能. 　　"*"　IE6、IE7可以识别.IE8、FireFox不能. 　　"_"　IE6可以识别"_",IE7、IE8、FireFox不能.　　
IE6 hack
　　_background-color:#CDCDCD; /* ie 6*/
IE7 hack
　　*background-color:#dddd00; /* ie 7*/
IE8 hack
　　background-color:red ; /* ie 8/9*/
IE9 hack
　　background-color:blue 9;