在css3中，可以利用animation-iteration-count属性来设置动画执行一次，该属性的作用就是定义动画的播放次数；当animation-iteration-count属性的值设置为数字“1”时，即可设置动画只播放一次。
本教程操作环境：windows7系统、css3&&html5版、dell g3电脑。
在css3中，可以利用animation-iteration-count属性来设置动画执行一次。
animation-iteration-count属性可以定义动画的播放次数，设置动画应该播放多少次。
语法：
animation-iteration-count: value;
值描述
n 一个数字，定义应该播放多少次动画
infinite 指定动画应该播放无限次（永远）
示例：
设置动画只播放一次
<!doctype html><html> <head> <meta charset="utf-8"> <style> div { width: 100px; height: 100px; background: red; position: relative; animation: mymove 3s; animation-iteration-count: 1; /* safari and chrome */ -webkit-animation: mymove 3s; -webkit-animation-iteration-count: 1; } @keyframes mymove { from { top: 0px; } to { top: 200px; } } @-webkit-keyframes mymove /* safari and chrome */ { from { top: 0px; } to { top: 200px; } } </style> </head> <body> <div></div> </body></html>
修改一下，设置动画播放3次
div { width: 100px; height: 100px; background: red; position: relative; animation: mymove 3s; animation-iteration-count: 3; /* safari and chrome */ -webkit-animation: mymove 3s; -webkit-animation-iteration-count: 3;}
（学习视频分享：css视频教程）
以上就是css3动画怎么设置执行一次的详细内容。