通用CSS Hack
浏览器的兼容性一直是个头疼的问题，使用“欺骗”技术可使各个浏览器效果一致，花了些时间整理了各个浏览器的HACK，主要包括IE系列和最新版本的Chrome、Safari、Firefox、 Opera，比较全面的记录下Hack，内容包括3部分：@ hack、属性Hack、选择器Hack，这些Hack已经测试并得到有效运用，有需要的同学可以放心使用，笔者会在以后不断的更新，如果有需要补充或者修改的，欢迎大家指教！
以下代码之间的空格是必要的，缺少空格导致失效
/*---------------------------------@ hack [[---------------------------------*/
@media all and (min-width:0){选择器{}} /* 支持IE9、Chrome、Safari、Firefox、 Opera */
@media screen and (-webkit-min-device-pixel-ratio: 0) {选择器{}}/* 仅支持wekit内核浏览器Chrome、Safari */
@media all and (-webkit-min-device-pixel-ratio: 10000), not all and (-webkit-min-device-pixel-ratio: 0) {选择器{}} /* 只支持Opera */
@-moz-document url-prefix() {选择器{}} /* 只支持Firefox */
如：
<p class="class">@hack@hack@hack@hack@hack@hack</p>
<style type="text/css">
@media all and (min-width:0){ /* 在IE9文本颜色为红色*/
.class{color:#F00;}
}
@media screen and (-webkit-min-device-pixel-ratio: 0) { /* 在Chrome、Safari中文本颜色为绿色 */
.class{color:#0F0;}
}
@media all and (-webkit-min-device-pixel-ratio: 10000), not all and (-webkit-min-device-pixel-ratio: 0) { /* 在Opera中文本颜色为蓝色 */
.class{color:#00F;}
}
@-moz-document url-prefix() { /* 在Firefox中文本颜色为品红色 */
.class{color:#F0F;}
}
</style>
/*---------------------------------@ hack ]]---------------------------------*/
/*---------------------------------选择器hack [[---------------------------------*/
html* 选择器{} /* 只支持IE7 */
*+html 选择器{}/* 仅支持IE7 使用该选择器需要HTML顶部有声明：<!DOCTYPE HTML ......>*/
*html 选择器{}/* 只支持IE6 */
如:
<p class="class">选择器hack选择器hack选择器hack选择器hack选择器hack选择器hack</p>
html* .class{color:#F00;} /* 在IE7中文本颜色为红色 */
*+html .class{color:#0F0;} /* 在IE7中文本颜色为绿色 */
*html .class{color:#00F;} /* 在IE6中文本颜色为蓝色 */
/*---------------------------------选择器 hack ]]---------------------------------*/
/*---------------------------------属性hack [[---------------------------------*/
选择器{属性：属性值\9;}/* 支持IE6+ */
选择器{属性：属性值\0;}/* 仅支持IE8和IE9 */
选择器{属性：属性值\9\0;}/* 仅支持IE9 */
选择器{*属性：属性值;}/* 仅支持IE7和IE6 */
选择器{_属性：属性值;}/* 只支持IE6 */
选择器{属性：属性值!important;}/* 只不支持IE6 */
选择器{[;属性:属性值;]}/* 仅支持Safari和Chrome ，且只能放在选择器的最后一个属性，因为当浏览器解析[;;]后，不会再读取后面属性 */
如：
<p class="class">属性hack属性hack属性hack属性hack属性hack属性hack</p>
<style type="text/css">
.class{
color:#F00\0;/* 在IE8和IE9中文本颜色为红色 */
*color:#0F0; /* 在IE7中文本颜色为绿色 */
_color:#00F; /* IE6中颜色为蓝色 */
[;color:#F0F;]/* 在Safari和Chrome中颜色为品红色 */
}
</style>
/*---------------------------------属性hack ]]---------------------------------*/
最后的建议是：尽量写出无hack的结构和样式，做到可以向后兼容，减少多余代码，更加可以体现自己的专业化的态度。