关于浏览器的一些兼容性问题与解决方法

来源:互联网 发布:大数据查找算法 编辑:程序博客网 时间:2024/05/22 15:19

在IE下兼容半透明滤镜

**
例如:

div#box{  background:red;  filter:alpha(opacity=50);}<div id="box">text</div>

在上述例子中IE8以上是能正常运行的,可是在IE6和7是不起作用的,
div在IE6/7下默认没有hasLayout,没有hasLayout的元素上滤镜是不起作用的,
默认不具有hasLayout的元素是div、span,
可以用css激活元素的hasLayout,只要对应元素添加position/float/width(!auto)/height(!auto)/zoom/overflow即可,
只要添加了以上属性div、span在IE6-7下就可以支持滤镜了;
这里需要注意的是,haasLayout元素呈现为“矩形”。

**

IE6/7下支持display:inline-block

**
只要在需要加display:inline-block的元素下添加
*display:inline;
*zoom:1;
就可以在IE6/7下支持display:inline-block了

**

双边距bug

**
IE6下加了float:left;margin-left:100px;会出现双边距bug,也就是实际的margin-left会变成200px,
解决方法如下:
在对应元素上添加display:inline即可;

**

边界重叠规则

**
水平margin不重叠,浮动元素上下margin不重叠,飘动元素上下margin不重叠,常规折行上下margin重叠;

0 0
原创粉丝点击