CSS3动画

CSS3动画

通过 CSS3，我们能够创建动画，这可以在许多网页中取代动画图片、Flash 动画以及JavaScript。

CSS3动画有哪些实现方式？

Transition 、transform 、Animation ：
　　Transition特点：平滑的改变CSS的值
　　transform特点：变换主要实现（拉伸，压缩，旋转，偏移）
　　Animation特点：适用于CSS2，CSS3

animation & transition的相同点和不同点？

相同点：
　　　　都是随着时间改变元素的属性值。
不同点：
　　　　transition需要触发一个事件(hover事件或click事件等)才会随时间改变其css属性；
　　　　初始效果——最终的效果之间的变化；
　　　　animation在不需要触发任何事件的情况下也可以显式的随着时间变化来改变元素css的属性值，从而达到一种动画的效果，css3的animation就需要明确的动画属性值
　　　　初始效果———动画帧———动画帧————最终的效果

Animation 属性：

当您在 @keyframes 中创建动画时，请把它捆绑到某个选择器，否则不会产生动画效果。
通过规定至少以下两项 CSS3 动画属性，即可将动画绑定到选择器：
规定动画的名称
规定动画的时长