随着对html5和css3的运用普及， 页面中的简单动画 也随之常见，animation就被常用，我们运用Animation就能创建自己想要的一些动画效果了。

建议: 如果想要制作简单的不细致的动画效果 animation可以首选，比较好的动画，还是使用flash或js/jquery比较好。

 一、Keyframes 关键帧  

   在开始介绍Animation之前我们有必要先来了解一下"Keyframes",叫做“关键帧”。 @keyframes开头，后面紧接着是这个“动画的名称”加上一对花括号"{}"

  使用@keyframes规则，你可以创建动画。 创建动画是通过逐步改变从一个CSS样式设定到另一个。

    在动画过程中，您可以更改CSS样式的设定多次。

     指定的变化时发生时使用％，或关键字"from"和"to"，与0％到100％相同。
     0％是开头动画，100％是当动画完成（中间可以在多次定义）。

    写法 @keyframes  定义的名称{

           0%(from){定义的样式，其他}

         100%(to){定义的样式，其他}

    }

   兼容：  @ -浏览器号-keyframes  定义的名称{

           0%(from){定义的样式，其他}

         100%(to){定义的样式，其他}

    }

egg:   @keyframes moves{