为动画和其他属性使用双供应商前缀

Question

我正在处理一些 css 动画，在添加供应商前缀时遇到了一个小难题。我知道 "keyframes" 属性需要使用供应商前缀进行显式定义，就像 "transform" 等其他 CSS 属性一样。但是，我一直想知道我是否应该在两个部分都包含供应商前缀，或者 "keyframes" 就足够了。这是我的意思的一个例子：

ex1:

@-webkit-keyframes animation_name {
    0% {transform: rotateZ(0deg);}
    100% {transform: rotateZ(180deg);}
}

ex2:

@-webkit-keyframes animation_name {
    0% {-webkit-transform: rotateZ(0deg);}
    100% {-webkit-transform: rotateZ(180deg);}
}

哪个更正确？

提前致谢。

Answer 1

示例 2，因为这是我期望从自动前缀工具获得的输出样式，例如：enter link description here

为动画和其他属性使用双供应商前缀

Using double vendor prefixes for animations and other attributes

css

vendor-prefix

css-transforms

css-animations