CSS hack合集

• CSS屬性前綴法：：比如 IE6能識別下劃線"_"和星號" * "，IE7能識別星號" * "，但不能識別下劃線"_"，IE6~IE10都認識"\9"，但firefox對前面三個都不能認識。
• CSS選擇器前綴法：比如 IE6能識別*html .class{}，IE7能識別*+html .class{}或者*:first-child+html .class{}。
• IE條件注釋法：針對所有IE， <!--[if IE]>IE瀏覽器顯示的內(nèi)容 <![endif]-->。比如：針對IE6及以下版本： <!--[if lt IE 6]>只在IE6-顯示的內(nèi)容 <![endif]-->。這類Hack不僅對CSS生效，對寫在判斷語句里面的所有代碼都會生效(注：IE10+已經(jīng)不再支持條件注釋)。

.test1 { _color: red; }

.test2 { *color: yellow; }

*html .test { color: gold; }

.test3 { color: purple\9; }

.test4 { color: green\0; }

.test5 { -color: pink; }

.test6 { +color: gold; }

.test7 { *+color: blue; }

*+html .test { color: black; }

.test8 { color: #fff !important; }

.test9 { color: orange\9\0; }

color: black;  /* 所有 */
color: white !important; /* 除了IE6外 */
color: orange\9\0; /* IE 9/10 */
color: green\0;  /* IE 8/9/10 */
*color: yellow;   /* IE6/7 */
+color: gold;  /* IE6/7 */
*+color: blue; /* IE6/7 */
_color: red;  /* IE6 */

*html .test21 { color: gold; }

*+html .test22 { color: blue; }

@media screen\9 {   
  .test23 { color: purple; }  
}

@media \0screen\,screen\9 {   
  .test24 { color: gold; }  
}

@media \0screen {   
  .test25 { color: orange; }  
}

@media screen\0 {   
  .test26 { color: green; }  
}

@media screen and (min-width: 0\0) {   
  .test27 { color: red; }  
}

<!--[if IE]> 所有IE中生效 <![endif]-->

<!--[if IE 7]>  只在IE7生效 <![endif]-->

<!--[if gt IE 6]>  在IE6以上生效 <![endif]-->

<!--[if ! IE 6]>  在IE6上不生效（非IE6生效） <![endif]-->

<!--[if ! IE]>  所有IE中都不生效（非IE生效） <![endif]-->

<!--[if lt IE 6]>  IE6以下可生效 <![endif]-->

<!--[if lte IE 6]>  IE6及IE6以下可生效 <![endif]-->

<!--[if gte IE 6]>  IE6及IE6以上可生效 <![endif]-->

<!--[if (gt IE 6)&(lt IE 8)]> IE6版本以上且IE8版本以下可生效 <![endif]-->

<!--[if (IE 6)|(IE 7)]>  IE6或IE7可生效 <![endif]-->

@-moz-document url-prefix() {
  .test { color: red; }
}