在CSS3中，你可以使用@keyframes规则来创建动画，并通过animation-iteration-count属性来设置动画的循环次数。如果你想要动画无限循环播放，可以将animation-iteration-count的值设置为infinite。
以下是一个简单的例子，展示了如何创建一个无限循环的动画：
/* 定义关键帧 */
@keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}
/* 应用动画到元素 */
div {
width: 100px;
height: 100px;
background-color: red;
animation-name: example;
animation-duration: 2s; /* 动画持续时间 */
animation-iteration-count: infinite; /* 动画无限循环 */
}
在这个例子中，@keyframes定义了一个名为example的动画，它会在from和to之间渐变背景颜色。然后，这个动画被应用到一个div元素上，设置了动画持续时间为2秒，并且通过animation-iteration-count: infinite;使得动画无限循环播放。
如果你想要动画播放特定次数，可以将infinite替换为一个数字，比如3表示动画将播放3次。
div {
/* ...其他属性... */
animation-iteration-count: 3; /* 动画播放3次 */
}
此外，CSS3还提供了animation-direction属性来控制动画的方向，例如alternate可以让动画在每次迭代后反向播放，结合infinite可以实现来回循环的效果。
div {
/* ...其他属性... */
animation-direction: alternate;
animation-iteration-count: infinite;
}
在这个例子中，动画会在每次迭代后反向播放，从而实现来回循环的效果。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
