什么是WebKit，它与CSS有什么关系？

Question

最近，我看到有些标签为“webkit”的问题。这些问题通常与基于Web的CSS、jQuery、布局、跨浏览器兼容性等相关。

那么，“webkit”是什么？它与CSS有什么关系？我还注意到许多网站的源代码中有很多-webkit-...属性。这两者是否相关？

更新

从迄今为止的答案来看... WebKit是Safari/Chrome的HTML/CSS网络浏览器呈现引擎。IE/Opera/Firefox是否有类似的引擎？使用其中之一的优缺点是什么？例如，我可以在Firefox中使用WebKit功能吗？

最终的问题是... IE是否支持WebKit？

更新2

所有主要浏览器都使用不同的呈现引擎，这可能是为什么存在如此多的跨浏览器兼容性问题的主要原因！

那么，是否有某种项目或运动以使用所有浏览器都将使用的标准呈现引擎？HTML5是否会结束跨浏览器兼容性问题？

- Hristo

---

您的最后一个问题实际上是“能否告诉IE渲染它未被编程渲染的内容？”，答案是否定的。 - Gareth

Firefox的渲染引擎被称为Gecko。IE使用他们自己的专有引擎。 - troelskn

@Gareth...谢谢。这正是我不希望听到的 :) 在这种情况下，我希望IE能尽快开始兼容...并且人们停止使用IE6！ - Hristo

请查看 http://css3pie.com/，其中提供了一些通过 CSS 为 IE 添加 Webkit 功能的内容。 - Kenoyer130

WebKit是迄今为止最棒的HTML渲染引擎，毫无疑问。这里的“bad”并不是指质量差，借用NWA的话来说，是指非常出色。 - Dagg Nabbit

总有Chrome框架(http://code.google.com/chrome/chromeframe/)可用，但用户必须选择安装它，并且据我所知，即使已经安装，也无法强制IE 使用它。 - David Thomas

Answer 1

每个浏览器都有一个渲染引擎来绘制HTML/CSS网页。更新：显然，WebKit是Safari/Chrome的HTML/CSS网页浏览器渲染引擎。IE/Opera/Firefox是否有类似的引擎？使用其中一个引擎的优缺点和差异是什么？例如，我能在Firefox中使用WebKit功能吗？请注意，不需要解释，只需翻译。保留"{{"和"}}"和html标签。

• IE → Trident （停用）
• Edge → EdgeHTML（Trident的清理分支）（2019年Edge切换到Blink）
• Firefox → Gecko
• Opera → Presto（自2013年2月起不再使用Presto，考虑将Opera视为Chrome，因此现在使用Blink）
• Safari → WebKit
• Chrome → Blink（Webkit的一个分支）。

请参阅Comparison of web browser engines以获取不同领域的比较列表。

最终问题是...... WebKit是否受IE支持？

不是本地支持。

- kennytm

---

谢谢您回复我的更新。如果IE不支持WebKit，我知道它也不支持“-moz-”属性……那么我该如何让IE接受CSS3样式呢？ - Hristo

@Hristo：根据你需要的风格。 - kennytm

我没有特别的想法... 我只是知道当涉及到跨浏览器兼容性时，IE很差，我想知道WebKit是否是解决这个问题的方法。 - Hristo

应该更新。Chrome开发人员已将WebKit分支，而Opera不再使用Presto引擎。 - Richard

EdgeHTML现在已经被停用。 - DreamTeK

Answer 2

除了@KennyTM所说的内容外，还有：

• IE
  • 引擎: Trident
  • CSS前缀: -ms
• Edge
  • 引擎: EdgeHTML → Blink³
  • CSS前缀: -ms
• Firefox
  • 引擎: Gecko
  • CSS前缀: -moz
• Opera
  • 引擎: Presto → Blink¹
  • CSS前缀: -o (Presto) 和 -webkit (Blink)
• Safari
  • 引擎: WebKit
  • CSS前缀: -webkit
• Chrome
  • 引擎: WebKit → Blink²
  • CSS前缀: -webkit

¹⁾2013年2月12日，Opera（版本15+）宣布他们将从自己的Presto引擎转移到名为Blink的WebKit。

²⁾2013年4月3日，Google（Chrome版本28+）宣布他们将使用基于WebKit的Blink引擎。

³⁾2018年12月6日，Microsoft（Microsoft Edge 79+稳定版）宣布他们将使用基于WebKit的Blink引擎。

- jerone

---

太棒了！那么不同的渲染引擎会忽略这些前缀吗？例如，Firefox会忽略“-msie”、“-o”、“-webkit”； Webkit会忽略“-moz”、“-o”、“-msie”等等……？ - Hristo

@Hristo 是的，它不认为这些是有效的CSS，所以忽略了它们。 - JKirchartz

JKirchartz是正确的。其他浏览器将忽略彼此的CSS前缀。 - jerone

Opera正在转向的WebKit是Chromium版本，而Chromium本身正在转变为Blink。 - BoltClock

Answer 3

Webkit是一种被Safari和Chrome（还有其他浏览器，但这两个最流行）使用的网页浏览器渲染引擎。

CSS选择器上的-webkit前缀是只有这个引擎可以处理的属性，非常类似于-moz属性。许多人希望这种情况会消失，例如-webkit-border-radius将被标准的border-radius所取代，你不需要为多个浏览器写相同的规则。这实际上是“预规范”功能的结果，目的是在标准版本出现时不干扰标准版本。

对于您的更新：...它与IE没有真正的关系，至少在9之前，IE使用了另一种叫做Trident的渲染引擎。

- Nick Craver

---

那么-webkit-可以在Firefox中用于CSS3特性的高级渲染吗？ - Hristo

不，Firefox使用一种名为Gecko的渲染引擎。 - Gareth

@Hristo - Firefox使用一些类似的属性，但它们被称为“-moz”（代表Mozilla），在解析样式时会忽略“-webkit”角色 :) - Nick Craver

Answer 4

这个问题已经得到答复并被接受，但如果有人仍然想知道为什么今天的情况有些混乱，那么你就需要阅读这篇文章：

http://webaim.org/blog/user-agent-string-history/

它很好地解释了Gecko、Webkit和其他主要渲染引擎的演变以及导致当前用户代理字符串混乱状态的原因。

以下是最后一段话的引用：

然后Google建立了Chrome，Chrome使用WebKit，就像Safari一样，并且想要为Safari构建页面，因此假装自己是Safari。因此，Chrome使用WebKit，并假装自己是Safari，WebKit则假装自己是KHTML，KHTML则假装自己是Gecko，所有浏览器都假装自己是Mozilla，Chrome称自己为Mozilla/5.0（Windows; U; Windows NT 5.1；en-US）AppleWebKit/525.13（KHTML, like Gecko）Chrome/0.2.149.27 Safari/525.13，用户代理字符串变得非常混乱，几乎没有用处，每个人都假装成别人，造成很多混乱。

- CodeExpress

---

访问上面的链接，它很有信息量，最后的高潮非常搞笑。 - Arun Prasad E S

Answer 5

-webkit- 代表的是 Chrome、Safari、Opera 和 iOS 浏览器所属的一个组。它们都有一个共同的祖先，因此在运行 CSS 和 Javascript 时，它们的能力/限制通常被限制在该组内。

开发人员会使用 -webkit- 接着一些代码，意味着该代码仅在 Chrome、Safari、Opera 和 iOS 浏览器上运行。以下是完整的列表：

-webkit-（Chrome、Safari、新版本 Opera、几乎所有 iOS 浏览器（包括 iOS Firefox）；基本上任何基于 WebKit 的浏览器）

-moz-（Firefox）

-o-（旧版本的 Opera，即 Webkit 前的版本）

-ms-（Internet Explorer 和 Microsoft Edge）

- Tycholiz

Answer 6

最终的问题是... WebKit 是否被 IE 支持？

有点。看看 Chrome Frame，这是一个为 Internet Explorer 设计的插件，它使其使用 Webkit 引擎。唯一的小问题是你必须说服你的访问者安装这个插件。

更新

Chrome Frame 不再得到维护或支持...

- edgerunner

---

Chrome框架已不再受支持。 - Eric Willigers

是的。最多只是临时解决方案。在8年后，是时候让IE退居幕后，让合规的浏览器来接替了。 - edgerunner

微软希望IE消失。它在Windows 10中提供是为了向后兼容的目的。 - R.J. Dunnill

Answer 7

WebKit是一个设计用于允许Web浏览器呈现网页的布局引擎。 WebKit引擎提供了一组类来在窗口中显示Web内容，并实现浏览器功能，例如当用户单击链接时跟随链接，管理后退列表以及管理最近访问的页面历史记录等。WebKit最初作为KHTML的分支创建，作为Apple Safari的布局引擎；它可移植到许多其他计算平台。它还用于Google的Chrome浏览器。WebKit的WebCore和JavaScriptCore组件可在GNU Lesser General Public License下使用，而其余部分则可在BSD-style许可下使用。

来源 维基百科

有关布局引擎的更多信息，请查看此处

- Sotiris

Answer 8

Webkit是Chrome和Safari所使用的HTML渲染引擎。

它支持一些自定义的CSS属性，这些属性带有前缀-webkit-。

- SLaks

Answer 9

Webkit是苹果Safari浏览器和Google Chrome中使用的HTML/CSS渲染引擎。 以-webkit-为前缀的CSS值是特定于Webkit的，它们通常是CSS3或其他非标准化功能。

回答更新2： W3C是试图标准化这些事物的机构，他们制定规则，然后程序员编写渲染引擎来解释这些规则。因此，基本上W3C说DIV应该按照“这种方式”工作，引擎编写者使用该规则编写其代码，任何错误或对规则的错误解释都会导致兼容性问题。

- JKirchartz

Answer 10

Webkit是流行浏览器Safari和Chrome等的渲染引擎。

- recursive