CSS Hack大致有3种表现形式,属性级Hack、选择器Hack以及IE条件Hack
注意:尽可能减少对CSS Hack的使用。
原理:
由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。
IE hack
代码如下:
<!--[if <keywords>? IE <version>?]>
HTML代码块
<![endif]-->
针对不同的浏览器写不同的 CSS code 的过程,就是 CSS hack。示例如下:
#test{
Width:300px
Height:300px
background-color:blue
}
#test{
width:300px
height:300px
background-color:blue/*firefox*/
background-color:red\9/*all ie*/
background-color:yellow/*ie8*/
+background-color:pink/*ie7*/
_background-color:orange/*ie6*/ }
:root #test { background-color:purple\9} /*ie9*/
@media all and (min-width:0px)
{ #test {background-color:black} } /*opera*/
@media screen and (-webkit-min-device-pixel-ratio:0)
{ #test {background-color:gray} } /*chrome and safari*/