你的位置:首页 > 软件开发 > 网页设计 > ie下面兼容性问题的一些总结

ie下面兼容性问题的一些总结

发布时间:2015-11-20 01:00:05
最后一次搞ie兼容性问题,以后都可以不管了0.01.浮动兼容性1.1IE6下的双边距BUG在IE6下,块元素有浮动和横向margin的时候,最边上元素的横向margin值会被放大成两倍解决办法: display:inline;1.2IE6,7下li的间隙在IE6,7下li本身 ...

 最后一次搞ie兼容性问题,以后都可以不管了0.0

1.浮动兼容性

1.1IE6下的双边距BUG

在IE6下,块元素有浮动和横向margin的时候,最边上元素的横向margin值会被放大成两倍

解决办法: display:inline;

1.2IE6,7下li的间隙

在IE6,7下li本身没浮动,但是li内容有浮动的时候,li下边就会产生4px的间隙

解决办法: 1.给li加浮动(但是width就变为由自适应内容,所以还要加宽度)

  2.给li加vertical-align:top/middle/bottom;

ps:当li间隙问题,和最小高度问题都在时,只能用给li加浮动方法。

1.3ie67清除浮动需要触发haslayout才可以

.clear:after{content:'';display:block;clear:both;}

.clear{zoom:1;}

after伪类: 元素内部末尾添加内容;

:after{content"添加的内容";} IE6,7下不兼容

zoom 缩放 

a、触发 IE下 haslayout,使元素根据自身内容计算宽高。

b、FF 不支持;

1.4ie6,7下左边元素浮动,右边元素通过margin并到一行,会出现3像素bug。

解决方法:通过浮动并在一行

1.5当浮动元素和绝对定位元素是并列关系的时候,在IE6下绝对定位元素会消失

解决办法:

给定位元素外面包个div

1.6在IE6下的文字溢出BUG

    子元素的宽度和父级的宽度相差小于3px的时候,两个浮动元素中间有注释或者内嵌元素的时候,ie6下文字会溢出

解决办法:用div把注释或者内嵌元素用div包起来

 1 <style> 2  3 .wrap{ width:300px;} 4  5 .left{float:left;} 6  7 .right{width:300px;float:right;} 8  9 </style>10 11 <div class="wrap">12 13   <div class="left"></div>14 15   <div><!-- IE6下的文字溢出BUG --><span></span></div>16 17   <div class="right">范德萨范德萨范德萨</div>18 19 </div>

原标题:ie下面兼容性问题的一些总结

关键词:ie

ie
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。