css hack

属性前缀

_仅支持ie6

* ie6 ie7

\9 ie6+

\0 ie8+

\9\0 ie9+

color:#00F\0; /* IE8支持*/

*color:#FF0; /* IE7支持 */

_color:#F00; /* IE6支持 */

不论是什么方法，书写的顺序都是firefox的写在前面，IE7的写在中间，IE6的写在最后面。

补充：IE6能识别 *，但不能识别 !important,IE7能识别 *，也能识别!important;FF不能识别 *，但能识别!important;下划线”_“,IE6支持下划线，IE7和firefox均不支持下划线[1]   。

选择器前缀法(即选择器Hack)：例如 IE6能识别*html .class{}，IE7能识别*+html .class{}

background-color:blue; 各个浏览器都认识，这里给firefox用；
background-color:red\9;\9全部的ie浏览器可识别；
background-color:yellow\0; \0 是留给ie8的，最新版opera也认识，后面自有hack写了给opera认的，因此，\0咱们就认为是给ie8留的；
+background-color:pink; + ie7定了；
_background-color:orange; _专门留给神奇的ie6；

 

以: " #demo {width:100px;} "为例;

#demo {width:100px;} /*被FIREFOX,IE6,IE7执行.*/

* html #demo {width:120px;} /*会被IE6执行,以前的定义会被后来的覆盖,因此#demo的宽度在IE6就为120px; */

*+html #demo {width:130px;} /*会被IE7执行*/

因此最后,#demo的宽度在三个浏览器的解释为: FIREFOX:100px; ie6:120px; ie7:130px;

 

.title{ height:200px;

*height:200px !important;/*由于ie6不支持！important ,因此只识别ie7*/

*height:200px; }/*识别ie6*/

条件注释法

　

这种方式是IE浏览器专有的Hack方式，微软官方推荐使用的hack方式。举例以下

	只在IE下生效
	<!--[if IE]>
	这段文字只在IE浏览器显示
	<![endif]-->
	
	只在IE6下生效
	<!--[if IE 6]>
	这段文字只在IE6浏览器显示
	<![endif]-->
	
	只在IE6以上版本生效
	<!--[if gte IE 6]>
	这段文字只在IE6以上(包括)版本IE浏览器显示
	<![endif]-->
	
	只在IE8上不生效
	<!--[if ! IE 8]>
	这段文字在非IE8浏览器显示
	<![endif]-->
	
	非IE浏览器生效
	<!--[if !IE]>
	这段文字只在非IE浏览器显示
	<![endif]-->