CSS中的动画和过渡的区别

过渡

CSS过渡允许你平滑地改变属性值，但它们总是需要像hover那样被触发。属性变化不会立即生效。在一段时间内，属性变化会发生。例如，如果你把一个元素的颜色从白色改成黑色，这个变化就会立即发生。CSS的变化是在时间间隔内发生的，遵循一个可以定制的加速曲线。

在两个状态之间过渡的动画被称为隐式过渡，因为开始状态和最终状态之间的状态是由浏览器隐式定义的。

CSS动画允许对HTML元素进行动画处理，与过渡不同的是，过渡只进行A点到B点的操作，但也可以在中间进行更多的操作。动画由两个步骤组成，即在样式表中定义的CSS动画和一组表示动画开始和结束状态的关键帧。

过渡和动画之间的区别 –

过渡	动画
过渡不能循环(可以让它们这样做，但它们不是这样设计的)。	动画在循环中没有问题。
过渡需要一个触发器来运行，如鼠标悬停。	动画刚刚开始。它们不需要任何类型的外部触发源。
转场很容易在JavaScript中操作。	而动画则很难在JavaScript中操作。操作一个关键帧和给它分配一个新值的语法非常复杂。
转场使一个物体从一个点到另一个点产生动画。	动画允许你定义关键帧，通过各种属性和时间框架从一个状态变化到另一个状态。
使用过渡来操纵值	使用JavaScript。