css hack

来源：互联网发布：深圳蔓延视觉知乎编辑：程序博客网时间：2024/06/16 20:59

由于不同的浏览器对CSS的支持及解析结果不一样，还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。
　　CSS Hack大致有3种表现形式，CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack，CSS Hack主要针对 IE浏览器。
　　类内部Hack：比如 IE6能识别下划线"_"和星号" * "，IE7能识别星号" * "，但不能识别下划线"_"，而firefox两个都不能认识。等等
　　选择器Hack：比如 IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。等等
　　HTML头部引用(if IE)Hack：针对所有IE：，针对IE6及以下版本：，这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都会生效。

　　书写顺序，一般是将识别能力强的浏览器的CSS写在前面。

<!DOCTYPE html>  <html>  <head>      <title>Css Hack</title>      <style>      #test       {           width:300px;           height:300px;                     background-color:blue;      /*firefox*/        background-color:red\9;      /*all ie*/        background-color:yellow\0;    /*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\0;} }  /*opera*/    @media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }  /*chrome and safari*/    </style>  </head>  <body>      <div id="test">test</div>  </body>  </html>