CSS3 Animation学习笔记

Internet Explorer 9，以及更早的版本,

 

不支持 @keyframe 规则或 animation 属性。

 

Internet Explorer 10、Firefox 以及 Opera 支持 @keyframes 规则和 animation 属性

 

Chrome和Safari需要前缀-webkit- 

@keyframes（关键帧）

animation 使用规则，Name must,duration must

 

 Animation turn 顺序

 

 animation   所有动画简写，除了animation-play-state

 

 1、name                   动画名

 2、duration               动画执行（一个周期）时长       默认值：  0

 3、time-function        动画速度曲线                        默认值： ease

 4、delay                    动画何时开始                         默认值： 0

 5、iteration-count      动画被播放的次数                  默认值： 1

 6、direction               动画在下一周期是否逆向播放    默认值： normal

 7、play-state             规定动画是否正在在运行或暂停 默认值：running

 8、fill-mode               规定动画时间之外的状态 

 

 悟性差，记忆差，所以多记记笔记了，必须重新过几遍

 

 

 概念链接：http://www.w3school.com.cn/css3/css3_animation.asp