前端小知识之【浏览器内核】

前言

通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同，这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。

浏览器内核分成两部分：渲染引擎和Javascript引擎，由于Javascript引擎越来越独立，内核就倾向于只指渲染引擎，负责请求网络页面资源加以解析排版并呈现给用户

默认情况下，渲染引擎可以显示html、xml文档及图片，它也可以借助插件显示其他类型数据，例如使用PDF阅读器插件，可以显示PDF格式

PC端浏览器内核

内核	开发者	使用浏览器
Trident	微软开发	IE浏览器、360浏览器、猎豹浏览器、2345浏览器、搜狗高速浏览器、UC等
Gecko	火狐开发	Mozilla Firefox(火狐)、Mozilla SeaMonkey、waterfox、AOL for Mac OS X等
Webkit	苹果开发	Apple Safari、傲游浏览器3、360极速浏览器7.5以前、 360安全浏览器6.0、UC等
Blink	Google和Opera Software开发	谷歌、 360安全浏览器7.0、360极速浏览器7.5等
Presto	Opera开发	Opera前内核 (已废弃)

Trident内核

Trident（又称为MSHTML），是微软开发的一种排版引擎。因IE捆绑在Windows中，所以占有极高的份额,它曾脱离W3C标准，后果就是大量的网页是专门为IE6等老trident内核编写，但这些网页的代码并不符合w3c标准,所以也就导致了我们要为早期IE的浏览器做兼容。其实不是浏览器的兼容性差了，而是你访问的的网页不符合新的标准，所以IE内核的浏览器存在很多兼容性的问题。

使用Trident内核的浏览器

IE浏览器、世界之窗、360安全浏览器兼容模式、遨游、搜狗浏览器、腾讯TT、UC浏览器（Webkit内核+Trident内核）；其中部分版本的浏览器是双核浏览器，甚至是多核。国内的厂商一般把其他内核叫做“高速浏览模式”，而Trident则是“兼容浏览模式”，用户可以来回切换

Gecko内核

FirefoxGecko是一套开放源代码的、以C++编写的网页排版引擎。因为它是开源的，所以收到很多人的青睐，其可开发程度很高。Gecko是最流行的排版引擎之一.仅次于Trident。

使用Gecko内核的浏览器

Mozilla Firefox(火狐)、Mozilla SeaMonkey、waterfox、AOL for Mac OS X等

WebKit内核(Chromium)

Webkit(Safari内核,Chrome内核原型,开源):它是苹果公司自己的内核，也是苹果的Safari浏览器使用的内核。它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高，导致一些编写不标准的网页无法正常显示。主要代表作品有Safari和Google的浏览器Chrome(曾经)

使用webkit内核的浏览器

apple 的safari(win/mac/iphone/ipad)、塞班手机浏览器、Android手机默认的浏览器、
360安全浏览器6.0、360极速浏览器7.5之前、猎豹安全浏览器1.0-4.2、傲游浏览器3.X、UC浏览器等

Blink内核

Blink是一个由Google和Opera Software开发的浏览器排版引擎,谷歌原来使用苹果的WebKit内核，后转向Blink内核，谷歌此举欲降低Webkit即苹果在浏览器市场的影响力。Opera也采用其Blink浏览器核心。

使用Blink内核的浏览器

谷歌浏览器、Opera、360安全浏览器7.0、360极速浏览器7.5、猎豹安全浏览器4.3以后等

移动端浏览器内核

移动端的浏览器还是比统一的，基本是webkit内核，和少部分的的IE浏览器内核。 所以在我们去考虑移动端的布局的时候，我们最主要考虑的还是webkit。也就是几乎所有的属性和特性，移动端都是支持的。

• IE手机版和PC版皆为Trident内核的
• Opera手机版和PC版皆为Webkit内核（少部分版本仍然是Presto内核）
• Firefox手机版和PC版皆为Gecko内核
• Chrome手机版和PC版皆为Webkit内核
• Safari手机版和PC版皆为Webkit内核
• QQ手机浏览器内核为基于Webkit修改的X5内核
• UC手机浏览器内核为基于Webkit修改的U3内核
• 百度手机浏览器内核为基于Webkit修改的T5内核
• 360手机浏览器内核为基于Chrome修改的G5内核，Chrome、Chromium的内核就是Webkit排版引擎，所以又有的说是采用了Webkit。

应用

浏览器内核的不同导致了CSS3的属性在不同的浏览器存在兼容性，为了解决这个问题，我们需要在一些属性前面添加前缀。

核心	前缀
Trident	-ms-
Gecko	-moz-
WebKit内核	-webkit-
Presto	-o-

写在最后

更多前端知识请大家持续关注，尽请期待。各位小伙伴让我们 let’s be prepared at all times！

✨原创不易，还希望各位大佬支持一下！
点赞，你的认可是我创作的动力！
⭐️ 收藏，你的青睐是我努力的方向！
✏️ 评论，你的意见是我进步的财富！