导致此CSS Transition延迟的原因是什么，特别是Chrome中的颜色？

Question

在大多数属性上使用CSS转换按预期运行，除了这个问题我有颜色。

我已经设置了演示笔here。

当指示转换更改颜色属性时，它们都会相互排队，而不是一次全部发生。

这似乎仅限于webkit，因为IE和Firefox按预期工作。

#change {
    color: green;
    transition: color 200ms linear;
}
.changed {
    color: red;
}

Answer 1

我认为这是因为color是继承属性，而*选择器用于transition。您应该将transition: color仅设置为您更改的元素color，例如（http://codepen.io/sergdenisov/pen/QbjjjP）：

#container {
    padding: 0;
    transition: color 500ms;
}
#container * {
    transition: margin 500ms;
}