利用CSS的animation属性制作动画效果

使用简写属性，将动画（mymove）与 div 元素绑定：

.donghua
{
animation:mymove 5s infinite;
-webkit-animation:mymove 5s infinite; /*Safari and Chrome*/
}

Internet Explorer 10、Firefox 以及 Opera 支持 animation 属性。

Safari 和 Chrome 支持替代的 -webkit-animation 属性。

Internet Explorer 9 以及更早的版本不支持 animation 属性。

animation 属性是一个简写属性，用于设置六个动画属性：

• animation-name   （规定需要绑定到选择器的 keyframe 名称）
• animation-duration    （规定完成动画所花费的时间，以秒或毫秒计）
• animation-timing-function    （规定动画的速度曲线）
• animation-delay     （规定在动画开始之前的延迟）
• animation-iteration-count     （规定动画应该播放的次数）
• animation-direction     （规定是否应该轮流反向播放动画）

语法：

animation: name duration timing-function delay iteration-count direction;

@keyframes mymove
{
from {left:0px;}
to {left:200px;}
}

@-webkit-keyframes mymove /*Safari and Chrome*/
{
from {left:0px;}
to {left:200px;}
}