<css3>动画

<!--@keyframes XXX(动画名称)｛
form{top:0px}
to{top:100px}或
0%{top:0px}
25%{top:0px}
75%{top:0px}
100%{top:0px}
｝-->

<!--animation-name:none/XXX 动画名称-->
<!--animation-duration:1s   动画完成需要的时间-->
<!--animation-timing-function:动画的速度曲线
linear  动画从头到尾的速度是相同的
ease    默认。动画以低速开始，然后加快，在结束前变慢
ease-in 动画以低速开始
ease-out    动画以低速结束
ease-in-out 动画以低速开始和结束
cubic-bezier(n,n,n,n)   在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。
-->

<!--animation-delay:0/1 动画在多长时间后发生-->
<!--animation-iteration-count:
n 播放次数
infinite 无线播放
-->

<!--animation-direction:逆向播放
normal  默认值。动画应该正常播放
alternate   动画应该轮流反向播放
-->

<!--animation-play-state:
paused  规定动画已暂停
running 规定动画正在播放
-->

<!--animation-fill-mode :动画之外的状态
none    不改变默认行为。
forwards    当动画完成后，保持最后一个属性值（在最后一个关键帧中定义）。
backwards   在 animation-delay 所指定的一段时间内，在动画显示之前，应用开始属性值（在第一个关键帧中定义）。
both    向前和向后填充模式都被应用。
-->