1. 什么是浏览器兼容问题
网页在不同浏览器上展示效果不同而产生网页和浏览器间的兼容问题,解决这个问题才能让网页在不同浏览器中都更好的展示
2. 为什么会产生这种问题
根本原因:浏览器的内核不同,并且他们处理同一件事情时所做的处理不同
2.1 浏览器的内核
2.1.1 Trident
IE的内核,只能应用于windows平台且不开源
2.1.2 Gecko(壁虎)
火狐的内核,开源的,跨平台的【能在windows 、 linux 、 macOS上运行】
2.1.3 Webkit
safari、谷歌;开源
2.1.4 Presto
Opera使用的前内核,渲染速度最快的引擎,Opera现已改为Blink内核
2.1.4 Blink
由Google 和 Opera 开发的浏览器排版引擎,2013年4月发布。谷歌的前内核。
3. css bug、css hack
3.1 css bug
css 在浏览器中不能正确展示的问题 被称为 css bug。
3.2 css hack
CSS中,hack是指一种兼容css在不同浏览器中正确显示的技巧方法。
3.3 常见的问题
1. 不同浏览器的默认 margin 、 padding 不同
2. 图片的默认间距不同
3. css3的动画、过渡、flex也有
4. IE9以下不支持 opacity,得用filter:alpha(opacity = 50)
5. canvas、svg
对于css的兼容性问题来说,一般在开发项目之前清除默认样式能解决大部分因兼容问题导致的样式展示问题。
4. js兼容问题
1. 获取视口宽高 window.innerheight/width
2. 绑定事件 ie9 才有