常见的IE浏览器的一些兼容问题及解决方法

摘要:
浏览器兼容性问题2:当块属性标记float后面跟着一个水平边距时,IE6中的显示边距大于设置的问题症状:常见症状是IE6中下一个块经常从顶部到下一行命中:90%解决方案:在float的标签样式控件中添加display:inline;将其转换为内联属性备注:我们最常用的是div+CSS布局,而div是一个典型的块属性标签。当我们使用水平布局时,我们通常使用divfloat。如果我们使用边距来设置水平间距,这是一个兼容性问题,我们将不可避免地遇到。

浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同

问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。

碰到频率:100%

解决方案:CSS里    *{margin:0;padding:0;}

备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。

浏览器兼容问题二:块属性标签float后,又有横行的margin情况下,在IE6显示margin比设置的大

问题症状:常见症状是IE6中后面的一块被顶到下一行

碰到频率:90%(稍微复杂点的页面都会碰到,float布局最常见的浏览器兼容问题)

解决方案:在float的标签样式控制中加入 display:inline;将其转化为行内属性

备注:我们最常用的就是div+CSS布局了,而div就是一个典型的块属性标签,横向布局的时候我们通常都是用div float实现的,横向的间距设置如果用margin实现,这就是一个必然会碰到的兼容性问题。

浏览器兼容问题三:设置较小高度标签(一般小于10px),在IE6,IE7,遨游中高度超出自己设置高度

问题症状:IE6、7和遨游里这个标签的高度不受控制,超出自己设置的高度

碰到频率:60%

解决方案:给超出高度的标签设置overflow:hidden;或者设置行高line-height 小于你设置的高度。

备注:这种情况一般出现在我们设置小圆角背景的标签里。出现这个问题的原因是IE8之前的浏览器都会给标签一个最小默认的行高的高度。即使你的标签是空的,这个标签的高度还是会达到默认的行高。

浏览器兼容问题四:行内属性标签,设置display:block后采用float布局,又有横行的margin的情况,IE6间距bug

问题症状:IE6里的间距比超过设置的间距

碰到几率:20%

解决方案:在display:block;后面加入display:inline;display:table;

备注:行内属性标签,为了设置宽高,我们需要设置display:block;(除了input标签比较特殊)。在用float布局并有横向的 margin后,在IE6下,他就具有了块属性float后的横向margin的bug。不过因为它本身就是行内属性标签,所以我们再加上 display:inline的话,它的高宽就不可设了。这时候我们还需要在display:inline后面加入display:talbe。

浏览器兼容问题五:图片默认有间距

问题症状:几个img标签放在一起的时候,有些浏览器会有默认的间距,加了问题一中提到的通配符也不起作用。

碰到几率:20%

解决方案:使用float属性为img布局

免责声明:文章转载自《常见的IE浏览器的一些兼容问题及解决方法》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇STM32 HAL库 UART使用printfbootstrap-table的一些基本使用及表内编辑的实现下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

IE浏览器日期格式问题

easyUI项目中要向页面展示格式化后的日期:把Json传来的字符串格式去掉后面的00:00:00    formatter : function(value){ var date = new Date(value); var y = date.getFullY...

关于ES6兼容IE 问题记录之一

这两天在做前端网页时,遇到一个问题,页面打开发生乱码,如下: 现象:360 浏览器,在急速模式下(即谷歌模式)是OK的显示,第一张图布局OK;在兼容模式下(即IE模式)是显示NG的,第二张图布局乱码 查看360 浏览器,兼容模式下控制台也没有报错 分析原因:乱码的地方,我使用的是js 控制的行高,这里的行高 没有体现出来,即js没有执行,怀疑是jquer...

Asp.Net MVC项目中如何调试ActiveX插件

首选我们的得有Process Explorer这个软件,它的主要作用是负责找到IE中哪个进程加载了ActiveX的DLL文件 选择菜单栏Find=>Find Handle or DLL 输入要查找的ActiveX的名字 此时我们就知道这个IE进程里就加载这个插件,然后回到我们的vs当中选择附加到进程的为装载有这个DLL的IE进程然后就可以直接调试项目...

.NET 并行(多核)编程系列之七 共享数据问题和解决概述

    前言:之前的文章介绍了了并行编程的一些基础的知识,从本篇开始,将会讲述并行编程中实际遇到一些问题,接下来的几篇将会讲述数据共享问题。  本篇的议题如下:       数据竞争 解决方案提出 顺序的执行解决方案 数据不变解决方案 在开始之前,首先,我们来看一个很有趣的例子:    10个task,每个task都是把BankAccount.Bal...

强制将IE8设置为IE7兼容模式来解析网页(转)

英文原文:http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx 文件兼容性用于定义让IE如何编译你的网页。此文件解释文件兼容性,如何指定你网站的文件兼容性模式以及如何判断一个网页该使用的文件模式。 前言 为了帮助确保你的网页在所有未来的IE版本都有一致的外观,IE8引入了文件兼容性。在I...

HBuilderX代码提示失效解决方案

用了一段时间后,HBuilderX的代码提示功能突然不生效了,重新下载也没有用,解决方案是重置默认配置 提示:重置配置会清除编辑器内的项目,记得先保存 解决方案 1、找到HBuilderX根目录下的reset.bat文件并打开   2、输入任意内容并按回车  代码提示成功出现  ————————————————原文链接:https://blog.csd...