css3 常见兼容性样式

引言

由于各浏览器制造商遵寻各自不同的规则，使得浏览器渲染的差异性，并且个浏览器对CSS3的支持度不同，引发出页面渲染的兼容性问题。如何能够使前端页面在不同浏览器渲染出相同的效果，成为前端工程师不得不考虑的问题。下面就CSS3样式给出一些解决兼容性问题的方法：

---

当下主流的浏览器及其内核

浏览器	内核
google	Webkit->Chromium(V8)->Chromium(Blink+V8)
IE	Trident（IE8->IE8:Jscript->Chakra)
Safari	KHTML->Webkit(WebCore+JSCore)->Webkit2
FireFox	Gecko
Opera	Presto->Chromium(V8)->Chromium(Blink+V8)
Edge	EdgeHTML

---

常见兼容性样式前缀

    -o-
    -webkit-
    -moz-
    -ms-

存在兼容性的样式：

1. border-radius
2. box-shadow
3. border-image
4. background-size
5. background-origin
6. background-clip
7. text-shadow
8. transform
9. transition
10. animation
11. flex

详情请参考：

1. CSS3新特性，兼容性，兼容方法总结
2. 主流浏览器内核介绍（前端开发值得了解的浏览器内核历史）