CSS动画

1.css动画实现的几种方式
transition
keyframes(animation)
2.过渡动画和关键帧动画的区别
过渡动画需要有状态变化
关键帧动画不需要状态变化
关键帧动画能控制更精细
3.如何实现逐帧动画
使用关键帧动画
去掉补间(steps)
4.css动画的性能
性能不坏 浏览器引擎写好的
部分情况下优于js(css优化空间不多)
js可以做到更好(可以优化的条件下)
部分高危属性 box-shadow等

animation-direction: reverse;
/*停的时候保持状态*/
animation-play-state: paused;
/*决定最后停在哪里*/
animation-fill-mode: forwards;
animation-iteration-count: infinite;

可以指定一个动画的关键路径 中间的状态由css计算完成
相当于多个补间动画(要求元素有变化)
与补间动画不同，关键帧动画与元素状态的变化无关
定义更加灵活
transform
四大作用：缩放(scale) 位移(translate(XYZ)) 旋转(rotate(XYZ)) 倾斜 (skew)