常见bug及其修复方法有以下几种

1、双外边距浮动bug

双外边距浮动bug在IE6及更低版本中常见。所谓双外边距浮动bug是指使任何浮动元素上的外边距加倍。(见下图)

只要将元素的display属性设置成inline就行了。因为元素时浮动的,所以将display属性设置为inline实际上不会影响显示方式。但是,这似乎会阻止Windows上的IE6及更低版本将所有外边距加倍。所以每当对具有水平外边距的元素浮动时,都应该很自然的将display属性设置为inline,以备外边距将来被加大

2、3像素文本偏移bug

Windows上IE5和IE6非常常见的bug是3像素的文本偏移bug.当文本与一个浮动元素相邻时,这个bug就会表现出来。例如,将一个元素向左浮动,并且不希望相邻段落中的文字围绕浮动元素。你可能会在段落上应用一个宽度等于浮动元素的宽度的外边距。

.myFloat{
float:left;
width:200px:
}
p{
margin-left:200px;
}

但这样做就会在文本和浮动元素之间莫名其妙出现一个3像素的间隙。一旦浮动元素停下来,3像素就会消失(如下图)。

解决方法是(1)设置一个小的高度并不会影响元素在这些流浪器中的实际尺寸;(2)将外边距重新设置为零;(3)在浮动元素上设置一个负的3像素右边距;

p{
height:1%;
margin-left:0
}
.myFloat{
margin-right:-3px;
}

如果浮动元素是图片时,还需要改变图像的外边距。

/*IE5.x在图像的左右都添加了3像素的间隙,所以需要改变图像的外边距*/
p{
heigth:1%;
margin-left:;
}
img.myFloat{
margin:0 -3px
} /*应用于IE6的样式表*/
p{
height:1%;
margin-left:;
}
img.myFloat{
margin:;
}

3、IE6的重复字符bug

所谓重复字符bug就是在某些情况下,一系列浮动元素的最后一个元素中的最后几个字符会在浮动元素下面重复出现。

当在一系列浮动的元素的第一个和最后一个元素之间有多个注释就会出现这个bug.前两个注释没有影响,但是后续的几个注释会导致两个字符重复出现。3个注释会导致两个字符重复,4个注释会导致4个字符重复,5个字符会导致6个字符重复。

避免这个bug的最容易、最安全的方法是从HTML代码中将注释删除掉。

4、IE6中的”藏猫猫“bug

出现这个bug的条件是:一个浮动元素后面跟着一些非浮动元素,然后是一个清理元素,所有这些元素都包含在一个设置了背景颜色或图像的父元素中。如果清理元素碰到了浮动元素,那么中间的非浮动元素看起来消失了,但其实隐藏到了父元素的背景颜色或图像后面,只有在刷新页面时才重新出现。

解决方法是避免清理元素与浮动元素接触。这里给出三种方法:(1)给容器元素应用特定的尺寸;(2)给容器指定行高;(3)将浮动元素和容器元素的position属性设置为relative;

5、相对容器中的绝对定位

这些bug的原因在于相对定位的元素没有获得IE/Win的内部hasLayout属性。因此,它们不创建新的定位上下文,所有绝对定位元素相对与视口进行定位。

解决方法是需要迫使相对定位的容器拥有布局。一种方法是在容器上显示地设置width和height。(在不知道容器的width和height情况下,或需要这些属性保持灵活的情况下使用。)

另一种方法是为容器设置一个小的高度不影响实际高度。

.container{
height:1%;
}

常见浏览器bug(针对IE6及更低版本)及其修复方法的更多相关文章

  1. SQL Server 2000 sp2 及更低版本不受此版本的 Windows 支持

    SQL Server 2000 sp2 及更低版本不受此版本的 Windows 支持.在安装了 SQL Server 2000 之后请应用 sp3. 出现这种现象的原因在于:Windows Serve ...

  2. 不知还有人遇到这个问题没有:数据库 'xxx' 的版本为 706,无法打开。此服务器支持 661 版及更低版本。不支持降级路径。

    一般情况是要给数据库升级 但我一直在百度看看有没有不动低版本数据库的方法 终于...发现..可能别人发现,但我没查到的 我可以用一个更高版本的数据库打开,然后生成脚本,然后把脚本拿出来

  3. FIREDAC连接MSSQL 2000报不能支持连接MSSQL2000及更低版本的解决办法

    FIREDAC连接MSSQL 2000的时候会报错,原因是MSSQL CLIENT11或MSSQL CLIENT10客户端驱动程序已经不支持连接MSSQL2000及更低版本的数据库. 解决办法: 设置 ...

  4. C# 当前 .NET SDK 不支持将 .NET Core 2.1 设置为目标。请将 .NET Core 2.0 或更低版本设置为目标,或使用支持 .NET Core 2.1 的 .NET SDK 版本。

    报错信息: 严重性 代码 说明 项目 文件 行 禁止显示状态 错误 NETSDK1045 当前 .NET SDK 不支持将 .NET Core 2.2 设置为目标.请将 .NET Core 2.1 或 ...

  5. HTML5中的语义标签兼容IE8以及更低版本的浏览器

    看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...

  6. 常见浏览器bug以及解决方法

    1.图片下方3像素: (1).描述:在div中插入图片时,图片会将div下方撑大三像素. (2).hack1:将</div>与<img>写在一行上(可以解决ie6/7): (3 ...

  7. 判断IE浏览器的类型以及提示信息(低版本浏览器不予显示)

    //浏览器IE版本判断(function(window) {    var theUA = window.navigator.userAgent.toLowerCase();    if ((theU ...

  8. 当前 .NET SDK 不支持将 .NET Core 2.2 设置为目标。请将 .NET Core 2.1 或更低版本设置

    场景重现 Windows 10 操作系统 (64-bit) 已经安装 .NET Core SDKs 如下: C:\Users\taadis>dotnet --list-sdks 2.1.202 ...

  9. 【Core】当前 .NET SDK 不支持将 .NET Core 2.2 设置为目标。请将 .NET Core 2.1 或更低版本设置

    问题起因: 新的电脑,打开core2.2的项目时,因为没有安装2.2 sdk,项目编译失败 所以在选择目标框架下拉框选择安装其他目标框架 会跳转到官网下载sdk:https://dotnet.micr ...

随机推荐

  1. Django:学习笔记(8)——视图

    Django:学习笔记(8)——视图

  2. XDU 1130 (快速幂)

    题目大意:原题链接 解题思路:sum((p+i*d)*C(n,i))=sum(p*C(n,i)+d*i*C(n,i)) ; 又因为i*C(n,i)=n*C(n-1,i-1) 所以sum((p+i*d) ...

  3. 将jar包发布到nexus仓库

    版本的快速迭代不适合release发布到仓库,snapshot方便版本的快速迭代. 1.pom改为snapshot <dependency> <groupId>com.sf.c ...

  4. 清晰讲解LSB、MSB和大小端模式及网络字节序

    时隔一个月又回到了博客园写文章,很开心O(∩_∩)O~~ 今天在做需求的涉及到一个固件版本的概念,其中固件组的人谈到了版本号从MSB到LSB排列,检索查阅后将所得整理如下. MSB.LSB? MSB( ...

  5. HDU - 4609 3-idiots (FFT+母函数)

    题意:给N个数,求任意选三个数能构成三角形的概率 分析:枚举两条边之和的复杂度\(O(N^2)\),显然不行,所以要更高效地做到枚举出两边之和. 所以用生成函数搭配FFT在\(O(NlogN)\)的时 ...

  6. Printf的缓冲机制

    转:https://blog.csdn.net/qq_25424545/article/details/78772959 今天用fork()写程序时候,突然发现自己对Printf的缓冲机制还是有些不够 ...

  7. 【英语学习】How do I stop overthinking at night?

    2017-04-03 If you were to say to the grown-ups: "I saw a beautiful house made of rosy brick, wi ...

  8. 20135302魏静静——linux课程第六周实验及总结

    linux课程第六周实验及总结 实验及学习总结 1.进程描述符task_struct数据结构 进程的作用: 将信号.进程间通信.内存管理和文件系统联系起来 操作系统的三大功能: 进程管理.内存管理.文 ...

  9. CentOS7系统安装及环境初始化

    操作系统安装:    将网卡名称设置为eth*,不使用CentOS 7默认的网卡命名规则.所以需要在安装的时候,增加内核参数.1. 光标选择“Install CentOS 7” 2. 点击Tab,打开 ...

  10. Elasticsearch Server,2nd Edition pdf 翻译 中文

    很偶然的机会,就需要接触到搜索,入门就是google trend已然超过solr的ES.在入门的时候找书的时候发现没有中文版的.于是自己开始翻译Elasticsearch Server,2nd Edi ...