收藏 分享(赏)

IE6兼容问题及其解决办法.doc

上传人:kpmy5893 文档编号:7655371 上传时间:2019-05-23 格式:DOC 页数:3 大小:27.50KB
下载 相关 举报
IE6兼容问题及其解决办法.doc_第1页
第1页 / 共3页
IE6兼容问题及其解决办法.doc_第2页
第2页 / 共3页
IE6兼容问题及其解决办法.doc_第3页
第3页 / 共3页
亲,该文档总共3页,全部预览完了,如果喜欢就下载吧!
资源描述

1、1.文档类型的声明。产生条件:IE6 浏览器,当我们没有书写这个文档声明的时候,会触发 IE6浏览器的怪异解析现象;解决办法:书写文档声明。2.不同浏览器当中,很多的标签的默认样式不同,如默认的外部丁内补丁。产生条件:不同浏览器;解决办法:利用 CSS reset文件进行样式的清除,然后再根据需要进行设置。3.横向双倍外边距产生条件:在 IE6中块元素浮动后,会出现横向双倍 margin现象。解决办法: 在 float标签的样式控制中加入 display:inline4.默认行高产生条件:IE6、IE7、遨游浏览器;设置的文字高度超出盒模型内容区域设置的高度。解决办法:给超出高度的标签设置 o

2、verflow:hidden;或者将文字的行高 line-height设置为小于块的高度。5.img外部的 border产生条件:img 外部有 a标签,即 img标签有链接时解决办法:设置 img边框 border:0;6.图片默认有间距。产生条件:img 标签(每个 img之后敲了回车)解决办法:为 img设置 float的浮动布局方式。7.经典 3像素 bug产生条件:IE6 浏览器,浮动块元素与未浮动块元素处于同一行,有默认的 3px间距。解决办法:设置非浮动元素浮动。8.默认行高产生条件:清除浮动的时候,有些人会采取一种清浮动的方法,使用一个空的 div,然后为这个 div设置cle

3、ar:both。在大部分浏览器当中,这样做是没有任何问题的,但是在 IE6浏览器当中,div 即使是空的,也会存在默认行高。解决办法:设置其高度为 0,并设置overflow:hidden。height:0;overflow:hidden;clear:both;9.a标签 hover不适用于所有标签产生条件:IE6 浏览器中 hover只支持 a标签的使用,不支持一切其它标签使用;解决办法:合理用 a标签嵌套其他行内标签或者用 javascript模拟 a的 hover效果。10.table标签当中 border-color属性设置无效产生条件:IE6 中 table设置属性 border-c

4、olor无效;解决办法:运用 CSS样式进行控制,而不是使用属性进行样式的处理。11.png格式图片产生条件:IE6 浏览器,不支持透明;解决办法:使用 javascript进行处理;或者使用 gif、jpg 图像替代掉 png图片的使用。12.透明 rgba与 opacity产生条件:IE6 不支持此两种透明的设置方法;解决办法:使用 IE6当中的滤镜 filter替代掉,如:opacity:0.6;filter:alpha(opacity=60)。13.子选择器在 IE6中不能使用产生条件:IE6 浏览器,使用 EF子选择器;解决办法:采用其他选择器或者采用后代选择器进行控制,如:div

5、pmargin:10px; div p pmargin:0;替代掉 divpmargin:10px;。14.不支持最大最小宽高产生条件:IE6 浏览器,标签的最低高度/宽度设置(min/max-height)解决办法:为 IE6单独设置 hack,即_height:最小高度值;_width:最小宽度值(对于IE6,当实际宽高超出定义的宽高时,元素会自动调整宽高) 。对于最大高度和最大宽度,没有必要设置兼容,当前对于开发者来说,只需要保证 IE6下正常显示即可,无需在它身上花费太多功夫。15.纵向居中,IE6 不支持 display:table-cell产生条件:IE6 浏览器,设置一个元素在另

6、一个元素中垂直方向上居中对齐,不能够支持以单元格的方式来显示元素;解决办法:如果是单行文本,采用 line-height和 height的配合使得文本垂直居中,如果中间是其他元素或者多行文本,采用其他方法进行居中处理,处理方法有多种。16.input 聚焦框颜色与样式不同产生条件:各个浏览器表现不同;处理方法:使用 outline:none,清除默认样式之后再统一设置。17.鼠标移上小手效果产生条件:IE6,cursor:hand :IE 完全支持。但是在 firefox是不支持的,没有效果。cursor:pointer :是 CSS2.0的标准。所以 firefox是支持的,但是 IE5.0

7、既之前版本不支持。IE6 开始支持。 ;解决办法:设置两种 cursor:pointer ; cursor:hand。18.子标签无法撑开父标签的高度产生条件:父标签内部含一个或多个子标签,父标签没有设置浮动,而子标签发生浮动;处理方法:方法 1:在子标签最后添加清除浮动的设置; 方法 2:为父标签添加overflow:hidden;的样式; 方法 3:为父标签设置固定高度。19.li的间距问题产生条件:IE6 浏览器 li 标签设置宽高,且 li里面的元素发生了浮动;处理方法:方法 1:li 不设置宽高; 方法 2:li 内部的标签不进行浮动。20.行内元素布局混乱产生条件:行内元素为包含框时,如果包含框包含的绝对定位元素以百分比为单位进行定位;处理方法:在行内元素当中加入zoom:1,触发 IE的 hasLayout。21.多显示一个字产生条件:多个浮动元素中间夹杂 HTML注释语句,浮动元素宽度设置为 100%;则在下一行多显示一个上一行的最后一个字符;处理方法:果断删掉注释!22.CSS优先级 !important产生条件:IE6 当中,在同一组 CSS属性中,!important 不起作用;处理方法:单独设置。23.img图片下部高度多余 5px产生条件:IE6 浏览器;处理方法:将图片转化为块级对象,即 display:block。

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 企业管理 > 管理学资料

本站链接:文库   一言   我酷   合作


客服QQ:2549714901微博号:道客多多官方知乎号:道客多多

经营许可证编号: 粤ICP备2021046453号世界地图

道客多多©版权所有2020-2025营业执照举报