调css支持firefox、IE6、IE7的方法-优快云博客

本文介绍了一种利用CSS属性!important及浏览器解析特性的方法来实现跨浏览器兼容性，特别是针对Firefox、IE6和IE7的不同解析规则进行了详细说明。

代码例子：

#bg{background:#CCC;filter:alpha(opacity=70);opacity:0.7;width:100% !important;width:180%;position:absolute;left:0px;top:0px;display:none;z-index:1;}
*+html #bg {width:180% !important; /* IE7 */}
在调css的支持顺序 firefox->IE6->IE7
1.先支持firefox
在firefox中带 !important 属性是是最高的优先级 (IE6、IE7 不能识别)。
所以在上面的代码片段中firefox识别后的width参数因该是width:100%
2.IE支持
2.1 在IE6中由于不能解析!important 属性所以IE6会抛弃这个设置然后解析后面个width:180%
所以在上面的代码片段中IE6识别后的width参数因该是width:180%
2.2在IE7中同样不能解析!important 属性所以IE7会抛弃这个设置然后解析后面个width:180%，之后有个IE7特有的*+html (元素属性结束后还要跟上!important,也就是说当*+html 和!important同时使用时才是IE7独有能识别的)，所以后设置的width:180%将覆盖先前设置的width:180%
所以在上面的代码片段中IE7识别后的width参数因该是width:180%

转载于:https://www.cnblogs.com/ydx2020/archive/2010/06/06/1752842.html