css3动画总结

 transition: all 0.5s; 

//设置了这个之后对该元素的css属性值的改变都会以动画方式呈现。

transform呈现的是一种变形结果，而Transation呈现的是一种过渡，通俗点说就是一种动画转换过程，如渐显、渐弱、动画快慢等。transition和transform是两种不同的动画模型。http://www.w3.org/TR/css3-transitions/

transition可以和Transform同时使用。

transition是一个复合属性，可以同时定义transition-property、transition-duration、transition-timing-function、transition-delay子属性值。

animation 属性是一个简写属性，用于设置六个动画属性：
1.animation-name：规定需要绑定到选择器的 keyframe 名称。
2.animation-duration：规定完成动画所花费的时间，以秒或毫秒计。
3.animation-timing-function：规定动画的速度曲线。

值描述linear动画从头到尾的速度是相同的。ease默认。动画以低速开始，然后加快，在结束前变慢。ease-in动画以低速开始。ease-out动画以低速结束。ease-in-out动画以低速开始和结束。cubic-bezier(n,n,n,n)在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。
4.animation-delay：规定在动画开始之前的延迟。
5.animation-iteration-count：规定动画应该播放的次数。

值描述n定义动画播放次数的数值。infinite规定动画应该无限次播放。
6.animation-direction：规定是否应该轮流反向播放动画。

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

注释：请始终规定 animation-duration 属性，否则时长为 0，就不会播放动画了。