新增!我的 44 页电子书“CSS 在 44 分钟内”已发布! 😃
#transition-timing-function
定义如何计算过渡开始和结束之间的值。
默认
transition-timing-function: ease;
过渡开始缓慢,在中间加速,并在结束时减速。
transition-timing-function: ease-in;
过渡开始缓慢,并逐渐加速直至结束。
transition-timing-function: ease-out;
过渡开始迅速,并逐渐减速直至结束。
transition-timing-function: ease-in-out;
类似于ease
,但更明显。
过渡开始迅速,并逐渐减速直至结束。
transition-timing-function: linear;
过渡具有恒定的速度。
transition-timing-function: step-start;
过渡立即跳转到最终状态。
transition-timing-function: step-end;
过渡保持在初始状态直到结束,然后立即跳转到最终状态。
transition-timing-function: steps(4, end);
通过使用带整数的steps()
,您可以定义在到达结束之前特定的步骤数。元素的状态不会逐渐变化,而是在单独的瞬间从一个状态跳跃到另一个状态。