css3-动画

一、制作关键帧：

1）@keyframes 动画名称{

from{开始}

to{结束}

}

2）@keyframes 动画名称{

0%{}

中间可以添加任意关键帧

100%{}

 }

二、调用关键帧

animation:

①animation-name(动画名称）

②animation-duration(动画的时间)

③animation-delay(动画的延迟时间)

④animation-function(动画的类型)：linear、ease、step-start

⑤animation-iteration-couunt(动画循环的次数）

⑥animation-direction（动画运动的方向）：reverse（反向运动）alternate（先正后反）alternate-reverse（先反后正）normal（正常方向）

⑦animation-play-state（运动的状态）：runing（运动）、paused（暂停）

⑧animation-fill-mode（动画静止的状态）：forwards