现在的位置: 首页 > 综合 > 正文

用!important实现ie6的hack

2018年05月15日 ⁄ 综合 ⁄ 共 657字 ⁄ 字号 评论关闭

以前对于!important这个属性不是很关注,也不是很清楚他的用处。
刚才在老杨
那看到他的一篇关于!important的应用,之后豁然开朗,原来!important也可以当做是ie6的hack。

看例子:

div{margin-left:20px;margin-left:40px;}

上面是ie6的一个经典BUG----双边距BUG,就是说当一个层用到float,又用到margin的属性的时候,ie6就有可能把这个层的margin值解析为双倍的。

其中一种解决办法:

div{margin-left:20px;margin-left:40px;display:inline;}

就是给这个层加一个display:inline的属性,使ie6和其他浏览器的解析都是一样的,具体的原理这里我就不解释了。

还有一种办法:

div{margin-left:40px;_margin-left:20px;}

用_margin-left:20px;这个只有ie6才解析的hack来解决双边距的BUG。

今天要介绍的用!important来解决的办法:

div{margin-left:40px !important;margin-left:20px;}

因为ie6不支持!important规范,而ie7及以上版本、Firefox、Chrome都支持!important规范,所以在ie7及以上版本、Firefox、Chrome浏览器中这个层的边距就是40px,而在ie6中,这个层的边距就会执行20px的语句了。

这也不失为一个ie6的小hack。

抱歉!评论已关闭.