这种方法是追求完美主义的写法，主要是配合我们上一节所说的IE条件注释，全部采用选择器Hack的写法。这种写法分两步：
1、创建条件样式表，并在HTML中body里添加相应的class类名：
<!–[if IE6]– ><body class=”ie6″ ><<![endif]–>
<!–[if IE7]– ><body class=”ie7″ ><![endif]–>
<!–[if IE8]– ><body class=”ie8″ ><![endif]–>
<!–[if IE9]– ><body class=”ie9″ ><![endif]–>
<!–[if !IE]– ><body class=”non-ie” ><![endif]–>
2、接着创建对应的样式
.demo {color: blue;}/*现代浏览器*/
.non-ie .demo {color: red;}/*除IE外浏览器*/
.ie9 .demo {color: yellow;}/*IE9浏览器*/
.ie8 .demo{color: green;}/*IE8浏览器*/
.ie7 .demo {color: orange;}/*IE7浏览器*/
.ie6 .demo {color: lime;}/*IE6浏览器*/
@media all and (min-width: 0px){
.demo {color:black;} /* webkit and opera */
}
@media screen and (-webkit-min-device-pixel-ratio:0){
.demo{color:#369;}/* webkit */
}
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
head~body .demo{color:#cf6;}/* opera */
}
@-moz-document url-prefix(){
.demo{color:#963;}/* firefox * /
}
上面就是目前各种浏览器下，相关CSS的Hack的写法，下面我们具体来看一个实例：
HTML Markup
<div class=”demo” >test color </div>
CSS Code
.demo {
color: red;/*所有现代浏览器*/
color: green9;/*所有IE浏览器*/
color: lime ;/*IE8-9浏览器*/
*color: red;/*IE6-7浏览器*/
+color: blue;/*IE7浏览器*/
_color: orange;/*IE6浏览器*/
}
:root .demo {color: #9639;}
@-moz-document url-prefix(){
.demo{color:#897;}/* all firefox */
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.demo { color: #000; }/*webkit*/
}
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
head~body .demo { color: red; }/*opera*/
}
请看最终效果图： 
下面罗列了各浏览器下的Hack的写法，大家写浏览的CSS Hack时也可以参考下面的图表
注：上图要是看不清楚，可以点击鼠标右键，将图片保存到本地后浏览，效果会更佳。上图也可以前往centricle.com在线查看。
那么到此就介绍完了有关于各浏览器的CSS Hack的写法，大家在平时需要使用Hack时可以根据CSS的选择器Hack和CSS的属性Hack对号入坐，不过我还是强调 在Web页面制作中尽量不要使用CSS Hack来处理兼容问题。因为任何浏览器下出现渲染不一致都极有可能是我们自己的结构或样式不符合W3C的某些要求，或者说违背了浏览器的某些规则而先造成的，所以我们应该尽量通过结构或CSS的修改来达到各浏览器渲染一致效果，除非到了万不得已情况下，才考虑CSS的Hack。
