【css3】animation

参数

1. animation-name : 关键帧动画的名字
2. animation-duration：播放时间(规定动画多久播放完毕)
3. animation-timing-function：播放方式（动画的速度曲线）
4. animation-delay：开始时间（也可理解为延迟多久开始播放）
5. animation-iteration-count：循环次数 （infinite无限循环）
6. animation-direction：播放方向 （alternate翻转回归原来状态）
7. animation-play-state：播放状态 （running 、paused）
8. animation-fill-mode：时间外属性（动画开始之前或结束之后发生的动作）
   none(默认) : 动画开始前与结束后均为元素默认状态
   forward 动画结束后保留最后一帧状态
   backwards 动画开始前即为动画第一帧状态
   both 前后均保存

keyframes（关键帧）

语法

     @keyframes xxx{          from {  }          66% {  }          to {  }     }

浏览器前缀
添加在这里：@-webkit-keyframes

调用

-webkit-animation : rotate 10s ease-in infinite alternate;@-webkit-keyframes rotate{        from {            transform: rotateX(180deg) rotateY(180deg);        }        to {            transform: rotateX(0deg) rotateY(0deg);        }    }