1、 animation
name --动画名
duration --设置动画所需时间(先)
timing-function --动画类型(线性 linear)
delay --延迟时间(后)
iteration-count --动画的播放次数(无限循环 infinite / n --n次)
direction --方向(正向/反向reverse)
fill-mode; --动画之外的状态(forwards)
2、animation-play-state(一般单独使用)
动画的播放状态(播放/暂停)
播放--running
暂停--paused
3、代码
css
.earth-con {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 500px;
height: 500px;
border-radius: 50%;
z-index: 2;
/* TODO:待补充代码,添加动画 */
/* 复合属性 */
animation: orbit 36.5s linear infinite;
/* 单独只用 */
animation-play-state: running;
animation-play-state: paused;
}