如何让CSS动画永远运行？

如何在 CSS 中永远为图片制作动画

在本文中，我们将解决围绕 CSS3 动画的一个常见问题：让它们无限期地运行。

挑战

假设您有一系列照片想要以幻灯片形式显示，并使用 CSS3 动画在它们之间平滑过渡。但是，您对默认行为不满意，即最后一张照片淡出并重新加载页面，从而有效地重新启动幻灯片。

解决方案

要实现无缝循环动画，我们需要修改 CSS 以指定动画应连续迭代。默认情况下，CSS 动画设置为仅运行一次。

我们将添加到 CSS 的关键属性是 animation-iteration-count。下面是一个示例：

通过将 animation-iteration-count 设置为 无限，动画将继续无限循环，在照片之间创建无缝过渡.

以上是如何让CSS动画永远运行？的详细内容。更多信息请关注PHP中文网其他相关文章！