博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浏览器兼容-哪些兼容
阅读量:6405 次
发布时间:2019-06-23

本文共 1571 字,大约阅读时间需要 5 分钟。

1、为什么各浏览器会产生兼容性问题?

 产生这个问题的主要原因是市面上的浏览器的种类很多,但由于不同的浏览器的内核不一致,从而导致各个浏览器对网页的解析就产生了差异。

2、html部分

 a、最突出也是最容易想到的就是高版本的浏览器用了低版本的浏览器无法识别的元素,从而导致不能解析。这点主要体现在html5的新标签上

       解决办法是:htmlshim框架可以让低于IE9的浏览器支持html5
 b、img的alt属性,在图片不存在的情况下,各浏览器的解析不一致
       在chrome下显示的是一张破损的图片,在ff下显示的是alt的文字,而在IE中显示的是破损的图片加文字(图片的onerror属性放一张替换图片)

 cul标签内外边距问题
       ul标签在IE6\IE7中,有个默认的外边距,但是在IE8以上及其他浏览器中有个默认的内边距

3、css部分

 a、css的hack问题:主要针对IE的不同版本,不同的浏览器的写法不同

  (css的hack:针对不同的浏览器写不同的CSS code的过程)

       IE的条件注释hack:
       <!--[if IE 6]>此处内容只有IE6.0可见<![endif]-->   
       <!--[if IE 7]>此处内容只有IE7.0可见<![endif]-->
 b、IE6双边距问题:IE6在浮动后,又有横向的margin,此时,该元素的外边距是其值的2倍
       解决办法:display:block;
 c、IE6下图片的下方有空隙
       解决方法:给img设置display:block;
 d、IE6下两个float之间会有个3px的bug
       解决办法:给右边的元素也设置float:left;
 e、IE6下没有min-width的概念,其默认的width就是min-width
 f、IE6下在使用margin:0 auto;无法使其居中
       解决办法:为其父容器设置text-align:center;
 g、 被点击过后的超链接不再具有hover和active属性
       解决办法:按lvha的顺序书写css样式
 h、在使用绝对定位或者相对定位后,IE中设置z-index失效,原因是因为其元素依赖于父元素的z-index,但是父元素默认为0, 子高父低,所以不会改变显示的顺序
 i、IE6下无法设置1px的行高,原因是由其默认行高引起的
       解决办法:为其设置overflow:hidden;或者line-height:1px;

4、js部分

 a、标准的事件绑定方法函数为addEventListener,但IE下是attachEvent;

 b、事件的捕获方式不一致,标准浏览器是由外至内,而IE是由内到外,但是最后的结果是将IE的标准定为标准
 c、我们常说的事件处理时的event属性,在标准浏览器其是传入的,IE下由window.event获取的。并且获取目标元素的方法也不同,标准浏览器是event.target,而IE下是event.srcElement
 d、在低版本的IE中获取的日期处理函数的值不是与1900的差值,但是在高版本的IE中和标准浏览器保持了一致,获取的值也是与1900的差值。
   
       比如:var year= new Date().getYear();
 e、ajax的实现方式不同,这个我所理解的是获取XMLHttpRequest的不同,IE下是activeXObject
 f、IE中不能操作tr的innerHtml
 g、获得DOM节点的父节点、子节点的方式不同
       其他浏览器:parentNode  parentNode.childNodes
       IE:parentElement parentElement.children

转载于:https://www.cnblogs.com/congfeicong/p/11051962.html

你可能感兴趣的文章
CISCO 路由器(4)
查看>>
网络服务搭建、配置与管理大全(Linux版)
查看>>
Silverlight 5 Beta新特性[4]文本缩进控制
查看>>
springMVC多数据源使用 跨库跨连接
查看>>
Git服务端和客户端安装笔记
查看>>
Spring Security(14)——权限鉴定基础
查看>>
IntelliJ IDEA快捷键
查看>>
【iOS-cocos2d-X 游戏开发之十三】cocos2dx通过Jni调用Android的Java层代码(下)
查看>>
MongoDB的基础使用
查看>>
进程间通信——命名管道
查看>>
ssh登陆不需要密码
查看>>
java mkdir()和mkdirs()区别
查看>>
虚拟化--003 vcac licence -成功案例
查看>>
windows server 2003各版本及2008各版本的最大识别内存大小
查看>>
OSChina 周六乱弹 ——揭秘后羿怎么死的
查看>>
IT人员的职业生涯规划
查看>>
sorry,you must have a tty to run sudo
查看>>
ios开发中使用正则表达式识别处理字符串中的URL
查看>>
项目中的积累,及常见小问题
查看>>
Python类型转换、数值操作(收藏)
查看>>