H5知识点（三）CSS3动画

过渡动画

仅定义首尾状态属性

@keyframes mymove{
 from{初始状态属性}
to{结束状态属性}
}

关键帧动画

可定义任意多的关键帧从而实现复杂的动画

@keyframes mymove{
 0%{初始状态属性}
50%（中间再可以添加关键帧）
100%{结束状态属性}
}

animation

animation-name
检索或设置对象所应用的动画名称
必须与规则@keyframes配合使用，
animation-duration
检索或设置对象动画的持续时间
animation-timing-function
检索或设置对象动画的过渡类型
属性值:
- linear：线性过渡。等同于贝塞尔曲线(0.0, 0.0, 1.0, 1.0)
- ease：平滑过渡。等同于贝塞尔曲线(0.25, 0.1, 0.25, 1.0)
- ease-in：由慢到快。等同于贝塞尔曲线(0.42, 0, 1.0, 1.0)
- ease-out：由快到慢。等同于贝塞尔曲线(0, 0, 0.58, 1.0)
- ease-in-out：由慢到快再到慢。等同于贝塞尔曲线(0.42, 0, 0.58, 1.0)
- step-start:马上跳到动画每一结束桢的状态
animation-fill-mode
设置对象状态
属性值:
none