常用的css hack介绍

CSS Hack常见的有三种形式:CSS属性Hack、CSS选择符Hack以及IE条件注释Hack, Hack主要针对IE浏览器。

 1 /* CSS属性级Hack */
 2 color:red; /* 所有浏览器可识别*/
 3 _color:red; /* 仅IE6 识别 */
 4 *color:red; /* IE6、IE7 识别 */
 5 +color:red; /* IE6、IE7 识别 */
 6 *+color:red; /* IE6、IE7 识别 */
 7 [color:red; /* IE6、IE7 识别 */
 8 color:red\9; /* IE6、IE7、IE8、IE9 识别 */
 9 color:red\0; /* IE8、IE9 识别*/
10 color:red\9\0; /* 仅IE9识别 */
11 color:red \0; /* 仅IE9识别 */
12 color:red!important; /* IE6 不识别!important*/
13 -------------------------------------------------------------
14 /* CSS选择符级Hack */
15 *html #demo { color:red;} /* 仅IE6 识别 */
16 *+html #demo { color:red;} /* 仅IE7 识别 */
17 body:nth-of-type(1) #demo { color:red;} /* IE9+、FF3.5+、Chrome、Safari、Opera 可以识别 */
18 head:first-child+body #demo { color:red; } /* IE7+、FF、Chrome、Safari、Opera 可以识别 */
19 :root #demo { color:red\9; } : /* 仅IE9识别 */
20 --------------------------------------------------------------
21 /* IE条件注释Hack */
22 <!--[if IE]>此处内容只有IE可见<![endif]--> 
23 <!--[if IE 6]>此处内容只有IE6.0可见<![endif]--> 
24 <!--[if IE 7]>此处内容只有IE7.0可见<![endif]--> 
25 <!--[if !IE 7]>此处内容只有IE7不能识别,其他版本都能识别,当然要在IE5以上。<![endif]-->
26 <!--[if gt IE 6]> IE6以上版本可识别,IE6无法识别 <![endif]-->
27 <!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
28 <!--[if lt IE 7]> 低于IE7的版本才能识别,IE7无法识别。 <![endif]-->
29 <!--[if lte IE 7]> IE7以及IE7以下版本可识别<![endif]-->
30 <!--[if !IE]>此处内容只有非IE可见<![endif]-->

 

posted @ 2015-07-27 14:52  goodpan  阅读(238)  评论(0编辑  收藏  举报