CSS动画

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

animation相关属性：

 animation-timing-function:linear;为匀速变化。

实现步骤：

复合属性：

例：

animation: move 3s linear .5s infinite alternate;
/* 名为move的动画，执行一个周期时间为3s，变化速度为匀速变化，延迟0.5s后播放，
播放次数为无限循环，运动方向为交替反向 */
animation: arise 1s steps(3) forwards;
/* 将动画分为3帧逐帧显示，显示完毕画面停留在最后一帧 */

ps:

1. 取值不分先后
2. 动画名称和动画时长必填
3. 如果有两个时间值，则第一个为动画时长，第二个为延迟时间

添加多个动画效果：