一.animation关键帧运动
- 设置运动规则及运动属性,并把运动规则的名称指定给相应元素
- animation-duration
- animation-timing-function
- animation-delay
- animation-iteration-count
- 设置运动关键帧:百分比指运动时间百分比
- 集成写法
animation:hd 2s linear 1s infinite;
运动名称 运动时间 运动状态 运动延迟 运动形式(次数)
二.旋转基准点设置
- transform-origin: 距离左侧xx像素 距离上侧xx像素
以此为基准点
三.轮流反向运动
四.运动填充
- animation-fill-rode:forwards; 运动完毕之后,保持最后一帧的状态
(也可写在集成animation属性里面) - animation-fill-rode:backwards; 在延迟期间元素会保持运动的初始状态
五.动画的暂停
animation-play-state:paused;