常用处理兼容性问题的方法

常用的处理兼容性问题的办法

1.cssHack

一丶http://browserhacks.com/

这个网站可以直接查询各种hack非常方便

2.通过Polyfill和shiv

Polyfill就像一个镊子可以帮我们刮平很多浏览器之的兼容性问题 : 

比如让不支持picture标签的引入picturefill插件就可以在不支持的浏览器使用picture标签

shiv和Polyfill差不多htmlshiv : https://github.com/aFarkas/html5shiv 

比如这个html5shiv：

作用：在ie678不支持新的html5标签，通过引入这个库，就可以让这些浏览器有能力识别这些标签，其实就是利用了ie的createElement

<!--[if lt IE 9]><script src="bower_components/html5shiv/dist/html5shiv.js"></script><![endif]-->

像这样引入

3.respond

通过引入这样一个库可以让ie678支持媒体查询

连接: https://github.com/scottjehl/Respond

4.通过Modernizr

它可以查询浏览器对css3，html5的支持情况，如果浏览器支持某个特性，那么它就会向浏览器添加相对应的类，如果不支持它就会添加一个no开头的一个类

这是一个主动去检测兼容性的一种方式，对于一些实现性的，或者不确定兼容性的一些特性，建议使用这种主动性检测的方式，这样提供了一种主动性的解决方案

用法 ：点击 download，自己选择特性 ，点击 build ，点击拷贝 ，拷贝到一个新的 js 文件，这个 js 就可以检测是否可以兼容哪个特性

如果支持，那么html标签上就会多一个类比如 svg 就会有 class="svg",这样就可以自己写两类类名.svg 和 .no-svg 分别引入不同的样式

具体用法参考官方文档

5.使用特性之前先到caniuse网站查询兼容性