IE和chrom兼容性分析(持续更新)

本文分析了从盒模型到文本渲染、输入框样式、事件处理、CSS背景图显示等方面,IE与Chrome的兼容性问题。针对这些问题,提供了相应的解决方案,如修改盒模型计算方式、调整CSS样式、使用特定的HTML实体来处理空格显示差异等。
摘要由CSDN通过智能技术生成

近期由于要做一个浏览性兼容的项目,由于原来项目基于IE7兼容模式的浏览器内核,现在要更换为Chrome的的浏览器内核,所以需要解决一些页面的浏览器兼容性问题:

1、盒模型相关。由于IE浏览器的盒模型的content和chrome的content+pandding+border相等,如下图所示:

W3C盒模型和IE盒模型 

2、小于 12px 字号的文字在Chrome下会被强迫渲染为 12px 字号,所以原来在IE中过小的字体将会在Chrome中设置为12px。

3、Chrome浏览器会压缩OPTION 元素中的全角空格,将其作为半角空格渲染。

4、在IE中input表单的button和chrome中的button不一致,有两种解决办法:

  • 按照blog中的方式进行修改:http://blog.sina.com.cn/s/blog_60b35e8301014g8c.html;
  • 手动修改input的style属性,如style = “height = xxpx;width = xxpx”,本人在项目中采用第二种方式进行修改。

5、IE和W3C中的事件处理异同

  • W3C DOM
obj.addEventListener(evtype,fn,useCapture)——W3C提供的添加事件处理函数的方法。obj是要添 加事件的对象,evtype是事件类型,不带on前缀,fn是事件处理函数,如果useCapture是true&#x
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

fullstack_lth

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值