css动画的基本使用动画的本质：快速切换大量图片是在人脑中形成具有连续性的画面构成动画的最小单元：帧和动画帧定义

动画

过渡可以实现两个状态间变化过程，但是实现不了多个状态间的变化过程而动画可以实现，动画过程可控（重复播放，最终画面，是否暂停）

动画的本质： 快速切换大量图片是在人脑中形成具有连续性的画面

构成动画的最小单元： 帧和动画帧

目标： 使用animation添加动画效果

实现步骤：

1.定义动画

@keyframes 动画名称{           @keyframes 动画名称{
	from{}							0%{}		
	to{}							10%{}
									15%{}
									100%{}
								}
}
animation: 动画名称 动画花费时长

动画的复合属性：

animation:动画名称 动画时长 速度曲线 延时时间 重复次数 动画方向 执行完毕时状态

注意：

动画名称和动画时长必须赋值

取值不分先后顺序

如果有两个时间值，第一个表示时长，第二个表示延迟时间

动画的单个属性：

WPS图片编辑.png WPS图片编辑2.png WPS图片编辑1.png

animation-direction:alternate-reverse;