DIV+CSS不用JS如何解决浏览器之间的兼容性问题

在小编最近的一次编写网页是发现,同一个页面在不同的浏览器里面打开的排版是不一样的,因为小编编写时一直对照这Chrome浏览器的页面来编写的,当时突发奇想,试试用IE来打开会怎样,一打开后发现惨不忍睹啊:

而Chrome浏览器的显示效果则非常正常:

发现了这个问题小编当时也决解不了,于是上网百度了下,发现这个问题普遍的存在:

由于浏览器的内核,标准的样式不同,会导致同一个页面在不同浏览器显示的效果不同.

然后发现了问题所在就好决解了,这里小编有两种方法,一种时使用通配符来使浏览器默认的padding和margin的数值为0,还有一种是使用CSS HACK来决解,但是这里只介绍第一种解决方法,因为这个是小编试过的:

把你的CSS样式添加上

*

之后,在对着浏览器的布局进行微调,你会发现两个浏览器的显示的布局基本一摸一样:

Chrome浏览器:

IE浏览器:

最后,一般解决了这两个浏览器的布局问题后,其他浏览器打开此页面也不会出很大的差错了.

谢谢大家的观看~

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20171226A036GG00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券