什么是CSS hack
<style type="text/css" >
.test{
background-color:green;
}
</style>
htm代码：
<div class="test" style="height:100px; width:100px; line-height:100px; margin:50px; border:1px solid #000;"></div>
结果应该是这样的：
在CSS3中常见一些这样的写法：
/*Mozilla内核浏览器：firefox3.5+*/
-moz-transform: rotate | scale | skew | translate ;
/*Webkit内核浏览器：Safari and Chrome*/
-webkit-transform: rotate | scale | skew | translate ;
/*Opera*/
-o-transform: rotate | scale | skew | translate ;
/*IE9*/
-ms-transform: rotate | scale | skew | translate ;
/*W3C标准*/
transform: rotate | scale | skew | translate ;
这些都是根据浏览器的内核不同来写的。CSS3目前标准还没有统一，各个浏览器都有自己的表现方式，甚至有的实现，有的未实现，在前面加一些前缀以表示支持某个特定浏览器，这也是CSS 内部hack的基本原理。
目前还有很大部一部分人习惯还是用IE的浏览器，所以这一块市场还是要做的，这就导致了前端的工作量增多了不少。下面说说CSS 内部hack。
CSS 内部hack的语法 是 selector{<hack>?property:value<hack>?;} ，例如：
<style type="text/css" >
.test{
* background-color:green;
}
</style>
在属性前面加个“*”这样的写法只会对IE6、7生效，其它版本IE及现代浏览器会忽略这条指令（没有特殊说明，本文所有hack都是指在声明了DOCTYPE的文档的效果）
<style type="text/css" >
.test{
- background-color:green;
}
</style>
在属性前面有个“-”这样的只有IE6识别。
<style type="text/css" >
.test{
_background-color:green;
}
</style>
在属性前面有个“_”这样的只有IE6识别。
<style>
.test{
*+background-color:pink;
}
</style>
在属性前面有个“*+”这样的只有IE6,IE7能识别。
<style type="text/css" >
.test{
background-color:green!important;
}
</style>
在属性值后面添加“!important”的写法只有IE6不能识别，其它版本IE及现代浏览器都可以识别。
还有\9,\0,\9\0。
<style type="text/css" >
.test{
background-color:green\9;
}
</style>
在属性后面加“\9”的，在所有（IE6,IE7,IE8,IE9,IE10）下都可以显示。其他浏览器都不会显示。
<style type="text/css" >
.test{
background-color:green\0;
}
</style>
在属性后面加“\0”的，在所有（IE8,IE9,IE10）下都可以显示。其他浏览器都不会显示。
<style type="text/css" >
.test{
background-color:green\9\0;
}
</style>
在属性后面加“\9\0”的，在IE9,IE10下都可以显示。其他浏览器都不会显示。
以上是css hack 内部样式。
选择器hack
选择器hack最常见的三种情况分别是：*html,*+html,:root。还有其他的，如：
@media screen\9{...}只对IE6/7生效
@media \0screen {body { background: red; }}只对IE8有效
@media \0screen\,screen\9{body { background: blue; }}只对IE6/7/8有效
@media screen\0 {body { background: green; }} 只对IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只对IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只对IE10有效
*html是针对IE6显示的。
*+html是针对IE7显示的。
:root是针对IE9显示的。
如果你想针对IE7显示写，你可以像以下这样：
*+html #ie7test { /* IE7 only*/
color:green;
}
如果你想针对IE9显示写，你可以像以下这样写：
：root .test{
background:green;
}
HTML头部引用
这是条件注释法，这种方式是IE浏览器专有的Hack方式，微软官方推荐使用的hack方式。举例如下：
<!--[if IE]>
这段文字只在IE浏览器显示
<![endif]--> 只在IE6下生效
<!--[if IE 6]>
这段文字只在IE6浏览器显示
<![endif]--> 只在IE6以上版本生效
<!--[if gte IE 6]>
这段文字只在IE6以上(包括)版本IE浏览器显示
<![endif]--> 只在IE8上不生效
<!--[if ! IE 8]>
这段文字在非IE8浏览器显示
<![endif]--> 非IE浏览器生效
<!--[if !IE]>
这段文字只在非IE浏览器显示
<![endif]-->
暂时先写到这里，后续再上。