过渡

定义需要过渡属性

定义哪个属性需要过渡,只有在该属性中定义的属性才会有过渡效果 transition-property 常用值

1. none:不能过渡任何属性
2. all:过渡所有能过渡的属性
3. 具体某个属性名:例如width,height,若有多个空逗号隔开 只有值为数字,或值能转换为数字的属性,才支持过渡

过渡时间

设置过渡的持续时间,即:一个状态过渡到另一个状态耗时多久 transition-duration 常用值:

1. 0:没有任何过渡时间 —默认值
2. s或ms:秒或毫秒
3. 列表:
   • 如果想让所有属性都持续一个时间,那就写一个值
   • 如果想让每个属性都持续不同的时间那就写一个时间的列表

过渡开始延迟

transition-delay 单位:s或ms

过渡的类型

transition-timing-function

1. ease:平滑过渡 —默认值
2. linear:线性过渡
3. ease-in:慢 -> 快
4. ease-out:快 -> 慢
5. ease-in-out:慢 -> 快 ->慢
6. step-start:等同于steps(1,start)
7. step-end:等同于steps(1,end)
8. steps(integer,?):接收两个参数的步进函数,第一个参数必须为正整数,指定的步伐.第二个参数可选值是start或end,指定每一步发值发生变化的时间点.第二个参数默认值为end.
9. cubic-bezie(number,number,number,number):特定的贝塞尔曲线类型

复合属性

设置一个时间,表示duration,如果设置两个时间,第一个是duration,第二个是delay,其他值没有顺序要求