什么导致这种CSS转换延迟，特别是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; 
}