1.引言
我们在写前端css代码的时候,兼容是必不可少的,下面这段代码应该是大家最为熟悉不过了
div{
width: 100px;
height: 100px;
-webkit-transform:rotate(-3deg); /*Chrome/Safari*/
-moz-transform:rotate(-3deg); /*Firefox*/
-ms-transform:rotate(-3deg); /*IE*/
-o-transform:rotate(-3deg); /*Opera*/
}
Tips: http://caniuse.com/=>查看浏览器对html5和css3属性支持情况
对于同一个属性,各大浏览器厂商对其理解不一致,导致各自有自己的一套实现方式,所以厂商希望程序员们通过添加私有前缀来保证兼容。那么浏览器表现为什么会不一致,为什么会出现众多的浏览器,一个世界一个浏览器始终是程序员们的梦,不过也只是梦而已!接下来就来解决以上问题。
2.引擎
小科普:浏览器其实是一辆跑车,驱动它前进的核心就是引擎。不过它是双引擎系统,渲染引擎(也是大家所说的内核,排版引擎等)和js引擎。渲染引擎是用来解释html,xml,css相关的布局表现等,js引擎则是解释js程序。所以想想这世界为什么有这么多款式的车,为什么车的性能不一,你也就能想明白引言中那两个问题。
渲染引擎
Trident内核
IE6、IE7、IE8(Trident 4.0)、IE9(Trident 5.0)、IE10(Trident 6.0)一直沿用到IE11,微软的代表,以致于trident内核也被称之为IE内核
Gecko内核
Netscape6开始采用的内核,后来的Mozilla FireFox(火狐浏览器) 也采用了该内核,是在Mosaic内核基础编写而成
Presto内核
Opera12.17及更早版本曾经采用的内核,现已停止开发并废弃。Opera现已改用Google Chrome的Blink内核
Webkit内核
它是苹果公司自己的内核,也是苹果的Safari浏览器使用的内核。 Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎,均是从KDE的KHTML及KJS引擎衍生而来。Google Chrome28以前的版本也使用webkit内核
Blink内核
Blink是一个由Google和Opera Software开发的浏览器排版引擎。这一渲染引擎是开源引擎WebKit中WebCore组件的一个分支,并且在Chrome(28及往后版本)、Opera(15及往后版本)和Yandex浏览器中使用
Edge内核
由于ie被大多数人诟病,所以微软推出新一代内核,用在新的EDGE浏览器
js引擎
V8引擎
V8 是 Google 发布的开源 JavaScript 引擎,用于chrome浏览器中
Carakan引擎
由Opera软件公司编写,自Opera10.50版本开始使用
SquirrelFish Extreme引擎
Safari开发了一个强劲的JavaScript引擎:SquirrelFish Extreme,是SquirrelFish新的升级版本
TraceMonkey引擎
用于Mozilla Firefox 3.5~3.6版本,Mozilla Firefox 4.0以上版本使用JaegerMonkey
IE的Jscript和Chakra引擎
IE从版本11开始,初步支持WebGL技术。IE8的JavaScript引擎是Jscript,IE9开始用Chakra,这两个版本区别很大,Chakra无论是速度和标准化方面都很出色
3.结束语
笔者只是出于对添加私有前缀的好奇心,才去查阅相关资料整理的此文,读者了解了解就好,不必深究