css - 为什么 css 命令在浏览器中不同

Question

我最近一直在检查css3 命令。 为什么其中一些在每个浏览器中都不同？

例如，看一下 this 2D transform example

div
{
transform: rotate(30deg);
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(30deg); /* Safari and Chrome */
-o-transform: rotate(30deg); /* Opera */
-moz-transform: rotate(30deg); /* Firefox */
} 

如果所有的人都接受相同的论点，为什么他们让他们变得不同？他们处于某种测试阶段吗？ 它们会一样吗(在测试阶段之后)？

如果你考虑this animation example，这很不切实际

@keyframes myfirst
{
from {background: red;}
to {background: yellow;}
}

@-moz-keyframes myfirst /* Firefox */
{
from {background: red;}
to {background: yellow;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {background: red;}
to {background: yellow;}
}

@-o-keyframes myfirst /* Opera */
{
from {background: red;}
to {background: yellow;}
} 

Answer 1

回答这个问题 - 是的，它们通常表示测试版实现。一旦一个特定的属性被标准化并且浏览器供应商添加了 ant 无前缀版本，他们通常将带前缀的版本保留为别名并在以后弃用它。此外，是的，一旦标准化，行为应该是相同的(除非出现意外错误!)

CSS 供应商特定的扩展是 specification 的一部分.浏览器供应商使用它们将未批准或非标准化的 CSS 功能添加到他们的浏览器中。理解是每个浏览器的功能可能不同，并且当无前缀规则标准化时它可能不是最终功能。

CSS 供应商前缀是 not well liked虽然有一些useful approaches以更简洁的方式处理它们，避免您强调的问题。