浏览器兼容性之四大内核

近期开发写前端代码比较多些，就网上搜了些资料来学习浏览器兼容性这类问题，兼容性这代码调起来还是很麻烦的。先总结些理论知识。

一、浏览器内核介绍

“浏览器内核”主要指渲染引擎(Rendering Engine)， 渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解析也有所不同，因此同一网页在不同的内核浏览器里的渲 染、展示效果也可能不同。主流的四大浏览器内核：
1、Trident内核代表：Internet Explore、搜狗
2、Gecko内核代表：Mozilla、Firefox
3、WebKit内核代表：Safari、Chrome
4、Presto内核代表：Opera
有些浏览器还是双内核比如：360极速、QQ浏览器等。

WebKit内核在手机上 的应用也十分广泛，例如Google的Android平台浏览器、Apple的iPhone浏览器、Nokia S60浏览器等所使用的浏览器内核引擎，都是基于WebKit引擎的。

最后再整体归纳下几种内核的优缺点吧：
①、Trident:因为在早期IE占有大量的市场份额，所以以前有很多网页是根据这个Trident的标准来编写的，但是实际上这个内核对真正的网页标准支持不是很好，同时存在许多安全Bug。
②、Gecko:优点就是功能强大、丰富，可以支持很多复杂网页效果和浏览器扩展接口，缺点是消耗很多的资源，比如内存。
③、Webkit:优点就是Webkit拥有清晰的源码结构、极快的渲染速度，缺点是对网页代码的兼容性较低，会使一些编写不标准的网页无法正确显示。
④、Presto：Presto内核被称为公认的浏览网页速度最快的内核，同时也是处理JS脚本最兼容的内核，能在Windows、Mac及Linux操作系统下完美运行。

二、使用css hack来兼容不同的浏览器

CSS Hack大致有3种表现形式(下面的讨论已经不包含IE6了)：
1、HTML头部引用Hack：这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都会生效。

    针对所有IE：
    针对IE9及以下版本：

    //html兼容ie的写法
    
    
    
    
    

    //类a某个样式在ie8上有问题时，就可以写成
     .ie8 .a{}

2、类内属性前缀法和选择器前缀法：CSS样式属性名前加上一些只有特定浏览器才能识别的hack前缀，以达到预期的页面展现效果

Paste_Image.png

三、不同浏览器内核对css3跟html5的支持

下面这篇文章介绍很详细了。
http://tools.yesky.com/101/11197101_2.shtml

四、总结

浏览器兼容性是个任重而道远的任务，近期都在看别人写的兼容性好的前端框架，获益不少，看着那些纯css实现的动画效果，让人惊呆了，前端也是门很深的课程。