CSS3之animation 属性

与transition不同，animation动画可以自动触发，且可以定义每一帧的动画效果，在动画效果上优于transition。
animation 属性是一个简写属性，用于设置六个动画属性：

一、animation-name
规定需要绑定到选择器的 keyframe 名称。
二、animation-duration
规定完成动画所花费的时间，以秒或毫秒计。
三、animation-timing-function
规定动画的速度曲线。默认是ease。

值	描述
linear	规定以相同速度开始至结束的过渡效果（等于 cubic-bezier(0,0,1,1)）。
ease	规定慢速开始，然后变快，然后慢速结束的过渡效果（cubic-bezier(0.25,0.1,0.25,1)）。
ease-in	规定以慢速开始的过渡效果（等于 cubic-bezier(0.42,0,1,1)）。
ease-out	规定以慢速结束的过渡效果（等于 cubic-bezier(0,0,0.58,1)）。
ease-in-out	规定以慢速开始和结束的过渡效果（等于 cubic-bezier(0.42,0,0.58,1)）。
cubic-bezier(n,n,n,n)	在 cubic-bezier 函数中定义自己的值。可能的值是 0 至 1 之间的数值。

四、animation-delay
规定在动画开始之前的延迟。
五、animation-iteration-count
规定动画应该播放的次数。默认是1。

值	描述
n	定义动画播放次数的数值。
infinite	规定动画应该无限次播放。

六、animation-direction
规定是否应该轮流反向播放动画。

值	描述
normal	默认值。动画应该正常播放。
alternate	动画应该轮流反向播放。