笔记：CSS hack的学习与了解…

浏览数：38 / 时间：2015年06月09日

更新时间：2015.05.12

兼容范围：

参考资料：

标记	IE6	IE7	IE8-10	FF	Opera	Sarari
[* + > <]	√	√	X	X	X	X
_ [*html .class{}]	√	X	X	X	X	X
\9	√	√	√	X	X	X
\0	X	X	√	X	√	X
@media screen and (-webkit-min-device-pixel-ratio:0){.bb {}}	X	X	X	X	X	√
.bb , x:-moz-any-link, x:default	X	√	X	√(ff3.5及以下)	X	X
@-moz-document url-prefix(){.bb{}}	X	X	X	√	X	X
@media all and (min-width: 0px){.bb {}}	X	X	X	√	√	√
* +html .bb {}	X	√	X	X	X	X
游览器内核	Trident	Trident	Trident	Gecko	Presto	WebKit

（以上 .bb 可更换为其它样式名）

注意点：

网上很多资料中常常把!important也作为一个hack手段，其实这是一个误区。!important常常被我们用来更改样式，而不是兼容hack。——造成这个误区的原因是IE6在某些情况下不主动识别!important,以至于常常被人误用做识别IE6的hack。但注意一下，IE6只是在某些情况下不识别（ie6下，同一个大括号里对同一个样式属性定义，其中一个加important 则important标记是被忽略的，例：{background:red!important; background:green;} ie6下解释为背景色green，其它浏览器解释为背景色red；如果这同一个样式在不同大括号里定义，其中一个加important 则important发挥正常作用，例：div{background:red!important} div{background:green}，这时所有浏览器统一解释为背景色red。）
个人不太推荐使用hack，尽可能不使用hack的情况下实现需求，做到较好的用户体验。
CSS Hack大致有3种表现形式，CSS属性前缀法、选择器前缀法以及IE条件注释法（即HTML头部引用if IE）Hack，实际项目中CSS Hack大部分是针对IE浏览器不同版本之间的表现差异而引入的。