css3 transition用法（很详细）

解释

transition（ CSS 属性）是 transition-property，transition-duration，transition-timing-function 和 transition-delay 的一个简写属性。
transition可以为一个元素在不同状态之间切换的时候定义不同的过渡效果。
以下是属性解释。

以下列出了transition常用的几种。

1. transition: property name | duration

举例： transition: width .8s;
表示width属性变化时 过渡时间为0.8s

2. transition: property name | duration | delay

举例：transition: width .8s .5s;
表示width属性变化时 过渡时间为0.8s 且延迟0.5s之后执行宽度变化

3. transition: property name | duration | timing function

举例：transition: width .8s ease-in-out;
使用了转速曲线，以慢速开始和结束的过渡效果。
time function可能的值有以下。

4. transition: property name | duration | timing function | delay

举例： transition: width .8s ease 1s;
表示宽度变化时，过渡时间为0.8s, ease表示规定慢速开始，然后变快，然后慢速结束的过渡效果，延迟1s执行宽度变化

5. 多个属性用逗号隔开

transition: height .8s, color .8s;

6. 应用于所有属性

transition: all 0.5s ease-out;

7. 其他

/* Global values */
transition: inherit;
transition: initial;
transition: unset;
参考地址：MDN、菜鸟教程