下面的表格列出了 @keyframes 规则和所有动画属性：
@keyframes规定动画。
animation所有动画属性的简写属性，除了 animation-play-state 属性。
animation-name规定 @keyframes 动画的名称。
animation-duration规定动画完成一个周期所花费的秒或毫秒。默认是 0。3
animation-timing-function规定动画的速度曲线。默认是 "ease"。3
animation-delay规定动画何时开始。默认是 0。3
animation-iteration-count规定动画被播放的次数。默认是 1。
animation-direction规定动画是否在下一周期逆向地播放。默认是 "normal"。
animation-play-state规定动画是否正在运行或暂停。默认是 "running"。
animation-fill-mode规定对象动画时间之外的状态。
下面的两个例子设置了所有动画属性：
实例
运行名为 myfirst 的动画，其中设置了所有动画属性：
div
{
animation-name: myfirst
animation-duration: 5s
animation-timing-function: linear
animation-delay: 2s
animation-iteration-count: infinite
animation-direction: alternate
animation-play-state: running
/* Firefox: */
-moz-animation-name: myfirst
-moz-animation-duration: 5s
-moz-animation-timing-function: linear
-moz-animation-delay: 2s
-moz-animation-iteration-count: infinite
-moz-animation-direction: alternate
-moz-animation-play-state: running
/* Safari 和 Chrome: */
-webkit-animation-name: myfirst
-webkit-animation-duration: 5s
-webkit-animation-timing-function: linear
-webkit-animation-delay: 2s
-webkit-animation-iteration-count: infinite
-webkit-animation-direction: alternate
-webkit-animation-play-state: running
/* Opera: */
-o-animation-name: myfirst
-o-animation-duration: 5s
-o-animation-timing-function: linear
-o-animation-delay: 2s
-o-animation-iteration-count: infinite
-o-animation-direction: alternate
-o-animation-play-state: running
}
要创建 CSS3 动画，你需要了解 @keyframes 规则。@keyframes 规则是创建动画。
@keyframes 规则内指定一个 CSS 样式和动画将逐步从目前的样式更改为新的样式。
