CSShack-针对IE6-IE7-IE8-IE9-firefox显示不同效果.docVIP

 HYPERLINK CSS hack：针对IE6，IE7，IE8，IE9，firefox显示不同效果 区别不同浏览器的CSS hack写法： 区别IE6与其它浏览器：  background:orange;_background:blue; 区别IE6与IE7：  background:green !important;background:blue; 区别IE6、IE7与FF：  background:orange; *background:green; 区别FF，IE7，IE6：  background:orange;*background:green !important;*background:blue;  区别IE与非IE浏览器 background:orange; background:green\9; 所有IE浏览器都识别(IE6、IE7、IE8、IE9)注：IE6/7能识别*;标准浏览器(如FF)不能识别*； background-color:orange\0; /*识别ie 8/9*/background-color:orange\9\0; /*识别ie 9*/ IE6能识别*，但不能识别 !important, IE7能识别*，也能识别!important; FF不能识别*，但能识别!important; IE6 IE7 FF * √ √ ×!important× √ √------------------------------------------------------ 另外再补充一个，下划线_, IE6支持下划线，IE7和firefox均不支持下划线。  IE6 IE7 FF * √ √ × !important× √ √ _ √ × × 于是大家还可以这样来区分IE6，IE7，firefox : background:orange;*background:green;_background:blue; 注：不管是什么方法，书写的顺序都是firefox的写在前面，IE7的写在中间，IE6的写在最后面。 一、CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) stylegt; #wrapper { width: 100px!important; /* IE7+FF */ width: 80px; /* IE6 */ } /stylegt; 2, IE6/IE77对FireFox *+html 与 *html 是IE特有的标签, firefox 暂不支持.而*+html 又为 IE7特有标签. style #wrapper { #wrapper { width: 120px; } /* FireFox */ *html #wrapper { width: 80px;} /* ie6 fixed */ *+html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */ } /style 注意: *+html 对IE7的HACK 必须保证HTML顶部有如下声明： !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtd 二、万能 float 闭合(非常重要!) 关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup] 将以下代码加入Global CSS 中,给需要闭合的div加上 style /* Clear Fix */ .clearfix:after { content:.; display:block; height:0; clear:both; visibility:hidden; } .clearfix { display:inline-block; } /* Hi