短css转换命令的定义？

Question

我发现了CSS转换命令的以下简短定义，但我不知道它们代表什么：

-webkit-transition: all 0.35s ease-in-out 0s;

all代表什么？ 为什么0s？

Answer 1

• all表示所有animatable properties都会被动画化;这是默认值，因此可以省略;当然，您只会看到实际上在初始状态和最终状态之间更改值的属性的转换;
• 0s是转换延迟;如果它是0s（可能有），可以省略 某些浏览器中只有0代替0s）
的问题

因此该代码实际上等同于：

transition: .35s ease-in-out;

此外，您编写的行使用-webkit-前缀，这意味着它只能在WebKit浏览器中使用。但是，all current versions of desktop browsers that support transitions support them unprefixed。

Answer 2

1. 'All'指定要转换的属性。
2. 最终时间参数是延迟参数。 “0”意味着，正如您所期望的那样，没有延迟。

如果我只想转换背景颜色，并延迟4秒，我会写：

transition: background-color 0.35s ease-in-out 4s;

Answer 3

有一些很好的文章详细介绍了transition -

的用法

http://css-tricks.com/almanac/properties/t/transition/

https://developer.mozilla.org/en-US/docs/Web/CSS/transition

Answer 4

transition: <property> <duration> <easing> <delay>;

Answer 5

通用属性转换是4个单独属性的简写：transition-property，transition-duration，transition-delay和transition-timing-function。

前两个属性是必需的，即使transition-property的默认值是all，它定义了所有可以转换的属性都将转换。 transition-timing-function属性由预定义函数定义。

持续时间和延迟属性定义为秒或毫秒，请记住，第一次定义的时间总是持续时间。

来源：https://kolosek.com/css-transition/