浏览器如何匹配css子属性

Question

据我们记载，我们可以在CSS3中定义动画，如

.class1{
    animation: name duration timing-function delay iteration-count direction play-state
}

我想知道我是否为每个属性赋予了价值，比如姓名，持续时间，时间功能等除了延迟，然后浏览器如何理解我已经跳过了延迟属性。

然后，如果我给出了动画属性的所有相应值，那么它与属性和值的匹配是1：1，但是如果想要跳过任何中间属性，例如

.class1 {
    animation: anim 2s cubic-bezier(0 0 1 1) 2 alternate running
}

此处我已跳过delay所以浏览器如何知道我已跳过delay属性而不是其他属性。

Answer 1

official W3C draft非常粗略，你不会得到一个好的“官方”答案。基本上，浏览器尝试根据规范顺序解析每个值，跳过那些与animation属性中的对应值不匹配的子属性;所以它首先看到第一个值是有效的animation-name，然后第二个值是有效的animation-duration，然后继续直到达到值2，这是不是< / em> animation-delay的有效值，因此它会跳过animation-delay并检查它是否是有效的animation-iteration-count。