IE10 / 11使用transition：-webkit-transform吗？

Question

请在IE10或11中查看此JSBin。

如果您检查#test元素，您将看到它将transition属性显示为-webkit-transform（并且不会发生过渡）。如果您注释掉transition: -webkit-transform;声明，如在这里，然后过渡工作。

IE为什么不将供应商前缀的值删除为无效的属性值？顺便说一句，如果我在Chrome上执行类似的操作（例如，输入-ms-transition之后），-webkit-transition它将按原样删除它，并仅使用-webkit-transition声明。似乎仅在IE上，这是一个问题。

Answer 1

我只是对此进行了更多研究，它看起来更像是一个Chrome错误，而不是IE。

这是规范中)有关无法识别和不可动画化的属性的说明transition-property：

如果列出的标识符之一不是公认的属性名称或不是可设置动画的属性，则实现仍必须使用列表中相应索引处的持续时间，延迟和计时功能，在列表中的可设置动画属性上开始转换。过渡持续时间”，“过渡延迟”和“过渡计时功能”。换句话说，必须将无法识别或无法动画处理的属性保留在列表中，以保留索引的匹配。

该规范似乎 没有
考虑到指定属性均不受支持或无法设置动画的情况，即使在过渡propdefs之后的部分中也是如此。似乎IE会将声明视为有效，尽管没有要转换的受支持属性，从而覆盖了先前的声明，并有效地使该声明等效于transition- property: none（即结果相似，但是如您所见，该值实际上并没有计算到none）。

Firefox的行为似乎与IE相同，将声明等同于transition-property: none。

此外，如果将未添加前缀和前缀的transform属性名称放在同一声明中，则IE和Firefox将使转换动画效果很好（顺序无关紧要）：

transition: -webkit-transform 1s, transform 1s;

但是，如果您放置了您希望与会导致Chrome删除声明的无法识别的属性一起使用的任何其他属性，它 仍然
会删除该声明。是的，在IE和Firefox在上述声明中正确应用转换的地方， Chrome会完全忽略它 。

不过，似乎只有未知的属性名称才有此问题。例如，如果您指定一个受支持但不能设置动画的属性，例如background-image：

transition: -webkit-transform 1s, background-image 1s;

Chrome可以对转换进行动画处理。

综上所述，我仍然不确定该规范是否模棱两可，或者IE和Firefox中显示的行为实际上是否正确。听起来这两种方法都可能需要一些澄清，所以我继续将有关此问题的[电子邮件发送给CSSWG。