如何利用Modernizr库做hack样式表

我们知道Modernizr 是一个用来检测浏览器功能支持情况的 JavaScript 库。 目前，通过检验浏览器对一系列测试的处理情况，Modernizr 可以检测18项 CSS3 功能以及40多项关于HTML5 的功能。 它比传统检测浏览器名称（浏览器嗅探）的方式更为可靠。 一整套测试的执行时间仅需几微秒。这对于前端开发者来说确实是很好的一个工具，当使用 Modernizr 检测 CSS3 支持情况时，你无需具备任何 JavaScript
的知识。 你仅需在网页中插入文件，它随即根据浏览器的功能情况在页面的标签上添加一组类。 相应类的名称已经符合标准化的要求并浅显易懂。 例如，如果浏览器支持 box-shadow 属性，则需要添加相应的 boxshadow 类；否则，添加一个 no-boxshadow类即可。 你所要做的一切只不过是创建一个使用这些类的样式表，以便为相应浏览器提供合适的样式。

利用Modernizr库，我们可以针对不支持特定的CSS3属性浏览器做出特定的样式表来渲染网页，例如浏览器如果不支持flex-box样式，可以在页面中添加

<script>
if(!Modernizr.Flexboxtweener){
var oStyle = document.createElement("link");
oStyle.rel = "stylesheet";
oStyle.type = "text/css";
oStyle.href = "css/hack.css";
document.getElementsByTagName("head")[0].appendChild(oStyle);
};
</script>

然后在hack.css样式表里重写所有flex-box属性样式。flex-box是一个弹性布局的样式，它不需要使用diplay:inline、float、这些属性就可以很方便的布局网页，用过的人应该很属性，如果浏览器不支持此属性，就需要对使用到这些个属性的地方重写样式，然后用上面的JS代码加以引用。则可以很好的解决浏览器的兼容性问题。腾讯微信自带的浏览器就不支持这个属性，不过腾讯QQ浏览器却是支持的。
一个公司的产品浏览器内核还不一样。