CSS hack是对付IE的利器。
不同的浏览器，甚至同一浏览器的不同版本对CSS的解析认识不一样，可能会导致生成的页面效果不一致。
有了CSS hack，就可以针对不同的浏览器来写不同的CSS。
常用的CSS hack的三种方式：
1) CSS 内部hack（最常用）
|
|
IE6 |
IE7 |
IE8 |
IE9 |
IE10 |
现代浏览器 |
|
* |
YES |
YES |
|
|
|
|
|
+ |
|
YES |
|
|
|
|
|
- |
YES |
|
|
|
|
|
|
!important |
|
YES |
YES |
YES |
YES |
YES |
|
\9 |
YES |
YES |
YES |
YES |
YES |
|
|
\0 |
|
|
YES |
YES |
YES |
|
|
\9\0 |
|
|
|
YES |
YES |
|
Eg：
div {
background-color:#f1ee18; // 所有识别
background-color:#00deff\9; // IE6、7、8识别
+background-color:#a200ff; // IE6、7识别
_background-color:#1e0bd1; // IE6识别
}
2) 选择器hack
选择器hack主要是针对IE浏览器。
|
|
IE6 |
IE7 |
IE8 |
IE9 |
IE10 |
现代浏览器 |
|
*html |
YES |
|
|
|
|
|
|
*+html |
|
YES |
|
|
|
|
|
:root |
|
|
|
YES |
|
|
Eg：
:root div {
background-color:green;
}
3) HTML 头部引用
HTML 头部引用类似于程序语句，只能使用在HTML文件里，而不能在CSS文件中使用，并且只有在IE浏览器下才能执行，这个代码在非IE浏览下非单不是执行该条件下的定义，而是当做注释视而不见。
lte：Less than or equal to的简写，小于或等于。
lt ：Less than的简写，小于。
gte：Greater than or equal to的简写，大于或等于。
gt ：Greater than的简写，大于。
! ：不等于。
Eg：
<!– 默认先调用css.css样式表 –>
<link rel="stylesheet" type="text/css" href="css.css" />
<!–[if IE 7]>
<!– 如果IE浏览器版是7,调用ie7.css样式表 –>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]–>
<!–[if lte IE 6]>
<!– 如果IE浏览器版本小于等于6,调用ie.css样式表 –>
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]–>