CSS前缀的目的是什么？ [复制]答案

【问题标题】：What is the purpose of CSS prefixes? [duplicate]CSS前缀的目的是什么？ [复制]
【发布时间】：2013-02-11 12:10:43
【问题描述】：

我知道，如果我们想确保某些 CSS3 功能在任何地方都能正常工作，我们需要使用 W3C 推荐的前缀版本，例如：

transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-webkit-transition: all 1s ease;

我知道前缀是用于实验性功能的，但为什么它们是必要的？他们为什么不在最初的 W3C 上测试它们呢？每个 CSS3 功能是否都有或有每个浏览器的前缀，或者如果他们认为应该创建一个前缀版本？

【问题讨论】：

Flexbox 模块是“为什么不遵循标准”的一个很好的例子。该规范多年来一直在工作，在任何浏览器中实现的第一个草案是从 2009 年开始的。从那时起，该草案已被完全重写。属性名称以及某些属性采用的值已更改。直到 2012 年 9 月，该规范才成为候选推荐。

【解决方案1】：

供应商前缀的最初目的是让供应商能够添加他们自己的非标准功能，以便在他们的 CSS 实现中使用。但是，它们中的大多数都用于最终成为标准的实验版本。

如果实验属性没有前缀，则表示它是属性的正确标准版本。如果每个浏览器都以不同的方式呈现它，那么就没有多少标准了。取而代之的是，浏览器会避免实现无前缀的属性，直到它确定它是根据标准执行的，然后它才开始支持无前缀的属性，以此表示它正确地支持了这个特定的标准。

并非每个功能都有前缀；实际上，供应商只有在认为有必要时才会创建前缀。

【讨论】：

此外，供应商应该在标准稳定后删除前缀（候选推荐）。基于 Webkit 的浏览器是唯一顽固地拒绝在许多新属性上删除前缀的浏览器（请参阅：caniuse.com/#search=gradient）。
@cimmanon：别再给我更多讨厌 WebKit 的理由了！
那是什么？你想要更多个理由吗？好的，给你！ css-tricks.com/tldr-on-vendor-prefix-drama
@cimmanon：我听说过。 Mozilla 和 Opera 有没有解决过这个问题？
不确定 Mozilla，但 Opera 有。我第一次注意到它们是在旧的 flexbox 演示中不应该工作的，因为 Opera 等到它离开草稿阶段后才实现它。

【解决方案2】：

使用实验性功能的人已经知道，根本不应该期望标准的跨浏览器行为。

在我看来，没有必要为新功能添加前缀。它使使用它们变得更加困难，因为您必须编写标准属性、chrome 的前缀属性、firefox、opera ......它还使样式表更大（谁将在将来删除所有这些前缀属性，当它们不需要时不再？）。

我没有看到任何优势，但这只是我的看法。

【讨论】：

【解决方案3】：

是的.. 将来我们可能不必为不同的浏览器使用这些前缀，但现在每个浏览器都有不同的 css 库，所以作为前端开发人员，我们必须在 css 中使用这些前缀，否则一些浏览器会不渲染我们的 CSS。这就是他们的工作方式，我们一直在关注他们。

这里是喜欢的 Webkit 和 Firefox 前缀库

【讨论】：