IE6 的 !important

从开始要学解决 CSS 兼容问题时候起,就经常听 important 有各种坏处,不要使用,并且 IE6 下不能生效。所以一下没有用 !important。直到昨天给新人讲 CSS 的时候,这个问题才被提起。早上旁边的小姑娘又问起,我说写个测试。结果如下(IE6截图):

示例代码如下:

<!doctype html>
<html>
<head>
	<style>
	.first{color:#f30!important;}
	.second{color:#f30!important;color:blue;}
	.third{color:green;color:#888!important;}
	.forth{color:#f60!important;}
	.fifth{color:#eee;}
	.sixth{color:#f60;}
	.seventh{color:#c30!important;}
	.eighth{color:#ff0!important;}
	.eighth{color:blue!important;}
	</style>
</head>
<body>

	<p class="first" style="color:green">.first{color:#f30!important;}</p>
	<p class="second" style="color:green">.second{color:#f30!important;color:#blue;}</p>
	<p class="third" style="color:green">.third{color:#green;color:#888!important;}</p>
	<p class="forth fifth" style="color:green">
		.forth{color:#f60!important;}<br />
		.fifth{color:#eee;}
	</p>
	<p class="sixth seventh" style="color:green">
		.sixth{color:#f60;}<br />
		.seventh{color:#c30!important;}
	</p>
	<p class="eighth" style="color:green">
		.eighth{color:#ff0!important;}<br />
		.eighth{color:blue!important;}
	</p>
</body>
</html>

由此我们可以得出的结论是:IE6 下是可以使用 !important 的,但相同选择器内如果 !important 不是写在最后,则 !important 失效。相同元素的不同选择器下,单独定义同一个属性的值,不管选择器的顺序如何,!important 仍然会生效。

多谢 @afc163 同学昨天课堂上做的分析。

© 2011 幸福收藏夹。 版权所有,转载务必注明。域名已经更新为: sofish.de
注意:当你觉得某篇文章有用,请直接看原文,因为通常我都会在写了文章后更新、去错别字、升级观点之类的。

你可能感兴趣的:(css,ie6,相关,!important)