transition过渡
transition的优点在于简单易用,但是它有几个很大的局限。
- transition需要事件触发,所以没法在网页加载时自动发生。
- transition是一次性的,不能重复发生,除非一再触发。
- transition只能定义开始状态和结束状态,不能定义中间状态。
- 一条transition规则,只能定义一个属性的变化,不能涉及多个属性。
animation动画
通过控制关键帧来控制动画的每一步,实现更为复杂的动画效果,可以解决transition过渡的不足。
区别
- transition需要触发一个事件才会随着时间改变其CSS属性。
- animation在不需要触发任何事件的情况下,也可以显式的随时间变化来改变元素CSS属性,达到一种动画的效果。 1)动画不需要事件触发,过渡需要。
2)过渡只有一组(两个:开始-结束) 关键帧,动画可以设置多个。