一.创建动画

@keyframes name{}

二.调用动画

animation：name，time(动画时长)

三.动画属性

animation：延迟时间  动画播放次数  动画播放方向  速度曲线  执行完毕时状态
延迟时间：动画开始执行之前要等待的时间 s/ms
动画播放次数：infinite 无限次播放
动画播放方向：alternate 交替播放
速度曲线：默认 ease； 1. linear 匀速播放  2. steps(次数)一般配合精灵图使用
执行完毕时的状态：forwards 动画会停在动画结束时的状态；

四.注意点

 动画名称和播放一次动画的时长必须写，其他属性需要就写
 forwards不能和infinite结合使用，否则不生效
 animation 里面属性值 不分先后顺序
 当属性值里有两个时间，第一个时间永远表示动画时长，第二个表示等待时间/延迟时间