ie6 bug 收集

border-style:dotted 点线  IE6不兼容  (除了solid以外,其它都有兼容问题,不完全一样)
a    IE6 不支持a以外的所有标签伪类,IE6以上版本支持所有标签的hover伪类。
inline-block  IE6 7不支持块元素标签的inline-block
空标签清浮动  IE6 最小高度 19px;这是font-size=0后,IE6下还有2px偏差。通过设置overflow:hidden来隐藏设置高度以外的高度。
after伪类  IE 6 7不支持after伪类清除浮动,通过zoom或是宽高解决
IE6 7下浮动元素的父级有宽度就不用清浮动了
zoom  firefox不支持,zoom可以触发ie中的haslayout=true,当父元素没有宽高时,通过zoom和after伪类来兼容各个浏览器。
overflow  IE6下不能包住浮动元素,也就是ie6下overflow 需要配合zoom:1
float  IE 6 7中需要并在同一行的所有元素都要加浮动,在其它浏览器中
<div>
         <divid=’div1’></div>
         <divid=’div2’>文字</div>
</div>
div2可以不加浮动,div1加浮动就可以了。但是ie67中文字环绕会有间隙,所有需要在div2上加浮动。
IE6下的双边距bug 在ie6下块元素有float和左右的margin,那么左右的margin会被放大2倍。
IE67下li间隙问题   ie6 7中的li本身没有浮动,但是li中的内容有浮动,li的下边就会产生几像素的间隙。 解决办法:内容有浮动,那么给li也加浮动;给li加vertical-align:top或是其它属性值。
img{border:none;vertical-align:top;}  /*解决a标签下img在ie6下会出现边框,解决图片下的空隙问题*/
opacity IE8及以下的浏览器用filter:alpha(opacity=0-100), 主流浏览器用opacity:0-1;
IE6 下的body 和html是没有高度的,所以需要加上 body,html{height:100%}
IEtester 是不支持滤镜的,ie浏览器是支持的。
position:fixed  IE6不支持固定定位
position:relative IE6下默认父级可以包住比自己大的子级(二者是没有定位的情况),而其他浏览器是包不住的,会产生溢出。解决办法overflow:hidden,但是加了overflow:hidden;IE6的父级是包不住子级的相对定位。解决办法:给父级也加上定位(相对、绝对都可以)。
position:absolute   IE6下绝对定位的父级宽高都为奇数时,那么元素的top 和bottom都会有1px的误差。
<label></label> label标签在如下情况IE6没有效果  <label><inputtype=’radio’>单选按钮的内容</input></label>。一般情况下点击文字和按钮都可以选中,但是ie6下点击文字没有效果。解决办法:<input type=’radio’ id=’a’><label for=’a’>单选按钮的内容</label></input>,将label中的文字和按钮相关联。
<form></form>  IE6下form与form之间是有边距的,解决办法:样式重置。
input  设置宽高,在各个浏览器效果不一样。通常不设置。
select 只能设置宽,高存在兼容问题,IE6下设置高没有效果。
IE6下  子元素可以撑爆父元素设置好的宽度,主流浏览器不可以,解决办法:测量时注意,不要让子元素宽高大于父元素的宽高。

IE6 下元素浮动,其宽度需要内容撑开,若内容是块元素,ie6下宽度撑开整行。解决办法:给里面的块元素也加上浮动。

IE67下 块元素想要一样显示,必须都加float,若是采用margin会产生3px的间隙。

P tdp等标签不可以嵌套块标签

IE6下最小高度问题
当ie6下元素高度小于19px时,会默认设置成19px,最好解决办法:给元素加上overflow:hidden;将多余的隐藏掉。还有种办法就是设置元素的font-size:0;但是效果不好仍然会有2px的误差,不建议使用。

ie6下border 1px dotted点线是虚线,2px就不会出现这样的情况。解决办法:切背景平铺。

如何避免子元素外边距传递问题
 
1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)
2、为父元素添加overflow:hidden;样式即可(完美,ie6下要触发haslayout加上zoom:1;
3、为父元素或者子元素声明浮动(float:left;可用)
4、为父元素添加border(border:1pxsolid transparent可用),ie6下margin消失,需要触发haslayout 加上zoom:1;
5、为父元素或者子元素声明绝对定位
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值