首页 > 代码库 > IE下的bug解决方案
IE下的bug解决方案
1、IE6下的双边距bug
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>双边距bug</title> <style> * { margin: 0; padding: 0; } .box{ width: 500px; height: 300px; background: red; float: left; /* 在块级标签中添加浮动float之后，又添加margin，会导致IE6下的双边距bug */ margin-left: 50px; /* 解决方案: 为IE6添加样式，将块级元素变为行内元素 */ _display: inline; } </style></head><body> <div class="box"></div></body></html>
2、IE6下的1px偏差
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>IE6的1px偏差</title> <style> /* position:absolute;解决方案：为IE6下的定位元素的父级宽高都设定为偶数，就可以避免 */ .box1 { width: 400px; height: 400px; border: 1px solid black; position: relative; } .box2 { width: 50px; height: 50px; position: absolute; right: -1px; bottom: -1px; background: yellow; } </style></head><body> <div class="box1"> <div class="box2"></div> </div></body></html>
3、IE6下overflo： hidden；不起作用。
解决方案：这时候给父级也添加position:relative;
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>在IE6-overflow-hidden</title> <style> .box1 { width: 500px; height: 300px; background: red; overflow: hidden; position: relative; } .box2 { width: 300px; height: 500px; background: yellow; position: relative; } </style></head><body> <div class="box1"> <div class="box2"></div> </div></body></html>
IE下的bug解决方案
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。