IE6/7兼容问题,有哪些兼容问题

1.最小高度,小于19像素IE6自动扩展到19像素。

解决办法:overflow:hidden

2.边框点线(IE6)不支持(只是一个像素的时候才出现问题)dotted

解决办法:切图片做背景

3.margin问题:<div class="box"><div class="div">margin</div></div>

(1)、margin传递的时候不显示。解决办法:1.父级【子级】加float:left;2.zoom:1;

(2)、margin传递:父级有边框的时候,子元素的margin值消失。解决:父级加zoom:1;

4.display:inline-block  在IE6/7下不支持块标签。无解决方法

5.浮动问题     (1)、IE6双倍距BUG(块元素有浮动和横向的margin值会被放大2倍)            解决:display:inline

(2)、在IE6/7   LI本身没有浮动,内容有浮动。li下边会产生一个间隙     解决1:给LI加宽度跟加一个浮动。     解决2:给LI加vertical-align:top

(3)、当IE6最小高度问题和LI的间隙共存的时候。给LI加浮动跟宽度

(4)、当一行子元素占有宽度之和和父级的宽度相差超过3像素(或有不满行的状态最后一行的子元素的下margin在IE6失效)  解决:无解决办法

(5)、IE6文字溢出BUG。1.子元素的宽度跟父级的宽度小于3像素的时候。2.两个浮动元素中间有注释或者内嵌元素。  <div class="box">  <div class="left"></div>      <div><!-- IE6下的文字溢出BUG --><span></span></div>      <div class="right">&darr;leo是个大胖子</div>  </div>

解决:用div把注释或者内嵌元素用div包起来

(6).当浮动元素与绝对定位元素是并列关系的时候。IE下会消失。  解决:给绝对定位加一个DIV

6.定位

(1)、IE6/7下,子元素有相对定位的话,父级overflow包不住子元素。         解决:给父级也加一个相对定位:

(2)、在IE6下,绝对定位的父级宽高是气数的时候,元素的right和bottom的时候有1px的偏差。解决:无解决方法

(3)、透明问题  IE:filter:alpha(opacity=70);    opacity:0.7;

7.表格表单

(1)、清除Google的边框     解决:outline: none;

(2)、清除文本域的拉宽线   解决:overflow:auto;

(3)、在IE6/7下输入类型的表单控件,有一个像素的上下间。        解决:给input加浮动

(4)、在IE6/7下输入类型的表单控件,加border:none无效;   解决:1、border:0;    2、重置input背景

(5)、在IE6/7下输入类型的表单控件输入文字的时候。背景图片会跟着文字走。   解决:1、把背景加给父级,再清除自身的背景。

(6)label在IE6下是不能使用的。解决:<input type="radio" name="gender" id="a" /><label for="a">男</label>

时间: 2024-11-13 06:54:41

IE6/7兼容问题,有哪些兼容问题的相关文章

jq双日历--最终版(功能兼容IE5,样式兼容IE6)

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>双日历选择</title> <link rel="stylesheet" href="double-date.css"/> <script src="jquery-1.11.3.min.js

IE兼容模式与非兼容模式下jq的写法

1.  $("#LabelRepeatType").removeAttr("disabled");                $("#LabelFinishDate").removeAttr("disabled"); 无论是否开启兼容模式都起作用  $("#LabelRepeatType").attr("disabled","");               

Spring data Jpa 分页从1开始,查询方法兼容 Mybatis,分页参数兼容Jqgrid

废话少说 有参数可以设置 在org.springframework.boot.autoconfigure.data.web.SpringDataWebProperties 中 /** * Whether to expose and assume 1-based page number indexes. Defaults to "false", * meaning a page number of 0 in the request equals the first page. */ pr

Javascript的DOM中兼容问题以及解决兼容问题的方法

一.获取非行内样式的方法和它的兼容问题及解决方式 方 法 一:getComputedStyle(obox,false)  第一个参数表示要获取的对象,第二个值指定一个要匹配的伪元素的字符串.必须对普通元素省略(或null)false也可以.主要针对正常浏览器 方 法 二:Element.currentStyle  在IE浏览器中使用 解决兼容问题的方式: function getStyle(ele,attr){ if(ele.currentStyle){ return ele.currentSt

IE6的兼容问题

随着微软windows系统系列的推出,当初的windows xp系统渐渐淡出操作系统的舞台,被新的有活力的操作系统所代替.虽然它渐渐推出了我们的视线,但是在某些地方我们还是能看到他们的,仍然在使用, 所以对于做前端开发的人员一定要考虑到我们制作儿的网页与windows xp操作系统的兼容问题——就是与IE6的兼容问题. 现在的浏览器种类繁多,可以说我们前端开发的东西在很多浏览器上都能使用,一般没有多大的问题.可是IE6就是那么个性,它的兼容性问题一直让很多前期的前端开发人员头疼.偶们来看看IE6

关于IE6中做兼容的那点事。

前言 对于程序员来说,一听到你做的程序必须兼容IE6(当然主流浏览器肯定得兼容的),那颗滚烫的心瞬间哇凉哇凉的,但是有时,项目就要求这样,你也只能硬着头皮跟IE6来个亲密接触,最近正好做了个项目,关于兼容IE6,真是废了点功夫,特此记录一下,方便以后查阅,也方便以后园友遇到同样问题可以参考一下. 正文 I.png透明图片不支持透明. 简介:项目中运用一部分png图片,在IE7以上,火狐,谷歌均是正常显示,但在IE6中,PNG图片背景出现差异,有时纯黑,有时纯白,有时纯灰等等,而不是透明,经过一番

DIV+CSS IE6/IE7/IE8/FF兼容问题汇总

1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了 <meta http-equiv="x-ua-compatible" content="ie=7" /> 2.flaot浮动造成IE6下面双倍边距问题,这个最常见,也最好处理,!important解决,比如 margin-left:10px !important;; margin-left:5px; +height:120px

IE6/IE7/IE8/FF兼容问题汇总,以及解决方案

1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了<meta http-equiv="x-ua-compatible" content="ie=7" />2.flaot浮动造成IE6下面双倍边距问题,这个最常见,也最好处理,!important解决,比如margin-left:10px !important;;margin-left:5px;+height:120px;5.有时

CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

目录 一.浏览器兼容 1.1.概要 1.2.浏览器内核 1.3.浏览器市场份额(Browser Market Share) 1.4.兼容的一般标准 1.5.CSS Reset 1.6.CSS Hack 1.6.1.条件注释法 1.6.2.样式内属性标记法 1.6.3.选择器前缀法 1.7.文档模式 (X-UA-Compatible) 1.8.javascript兼容 二.前端性能优化 2.1.概要 2.2.减少HTTP请求数量 2.2.1.图片地图 2.2.2.精灵图片(Sprite) 2.2.

浏览器兼容问题汇总(持续更新)

所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果.所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题. 在学习浏览器兼容性之前,我想把前端开发人员划分为两类: 第一类是精确按照设计图开发的前端开发人员,可以说是精确到1px的,他们很容易就会发现设计图的不足,并且在很少的情况下会碰到浏览器的兼容性问题,而这些问题往往都死浏览器