首页 > 其他 > 详细

ie6, ie7兼容性问题以及处理办法汇总

时间:2014-03-30 22:32:20      阅读:481      评论:0      收藏:0      [点我收藏+]
1、IE6中绝对定位位置错误
问题描述:在ie6中,如果参照物没有触发haslayout ,那么“绝对定位的容器”的left和bottom就会有问题。
解决办法:在“相对定位的父容器”上加入 zoom:1 来触发ie的haslayout即可解决。
小技巧:通常我们在设置一个容器为position:relative的时候 ,都会加上zoom:1来解决很多ie下的问题。

2IE6中绝对定位1像素偏差
问题描述:IE6下参照物宽高为奇数时,绝对定位元素设置了位置为0或100%时,仍会有1px的空隙 。
解决办法:设为偶数。


3、IE6中绝对定位消失
问题描述:IE6中绝对定位元素在浮动元素的前面或者后面消失。
解决办法:a:给绝对定位元素加 clear:both 。
                  b:给浮动元素 加负外边距。

4、IE67中相对定位元素溢出不动
问题描述:IE67中相对定位的元素在有滚动条的容器里会固定不动且溢出。
解决办法:只需要在有滚动条的容器上也设置position:relative即可。


5、IE6浮动元素双边距bug
问题描述:IE6中第一个左浮动的块级元素的margin-left加倍,第一个又浮动的块级元素的margin-right加倍。
解决办法:给第一个浮动元素加 display:inline。

6、IE6中浮动引起的3px的bug
问题描述:IE6中浮动元素与紧随其后的元素会有3px间距。
解决办法:给浮动元素 加负外边距。


7、IE67中表单元素向右偏离的bug
问题描述:当“某些表单元素”的“父元素上触发了haslayout”后,这些表单元素会以“祖先元素上的margin-left值”偏离。
解决办法:在“父元素外或内” “再嵌套一个触发haslayout的元素” 即可(zoom:1)。

8、IE67中图片链接点击无效的bug
问题描述:对于a>span>img结构,如果span触发了haslayout,那么img将点击无效。
解决办法:给img设置position:relative;z-index:-1;再给a设置cursor:pointer。

9、li在IE中底部3像素的BUG
问题描述:li包含a,span等行内元素同时设置行内元素float:left或display:block时,底部多出3px。
解决办法:给li设置 float:left。

10、IE6下链接伪类(:hover)CSS背景图片有闪动BUG
问题描述:主要原因ie会再一次请求这张图片,或者说图片没被缓存。
解决办法:在页面底部添加以下IE6专用代码,让IE6缓存CSS背景图片至本地。

ie6, ie7兼容性问题以及处理办法汇总,布布扣,bubuko.com

ie6, ie7兼容性问题以及处理办法汇总

原文:http://blog.csdn.net/zdp072/article/details/22597557

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!