CSS動畫是Web開發中常用的一種交互式設計方式，最近更是在Web開發中流行起來。無限時長的CSS動畫可以添加一些特殊的運動效果，以使您的網站更具吸引力和互動性。在這篇文章中，我們將學習如何使用CSS動畫來創建無限時長的動畫。

/* CSS動畫無限時長代碼 */
/* 設置動畫名稱 */
@keyframes example {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* 添加動畫 */
div {
animation-name: example;
animation-duration: 2s;
/* 設置無限時長的動畫 */
animation-iteration-count: infinite;
}

首先，我們需要使用@keyframes規則來定義動畫的過渡效果。在這個例子中，我們創建了一個名為“example”的動畫，這個動畫會讓一個元素從0度旋轉到360度。

接下來，在CSS中我們需要調用這個動畫。您可以使用animation-name屬性來命名您的動畫，動畫名稱需要與@keyframes中的名稱相匹配。然后，使用animation-duration屬性來定義動畫的持續時間，第一個數字是時間單位（毫秒或秒），第二個數字是動畫持續時間的長度。

最后，我們需要設置animation-iteration-count屬性來使動畫無限循環。您可以在這個屬性中使用“infinite”來表示動畫的循環次數為無限。

這是一個簡單的CSS動畫無限時長的例子。通過調整@keyframes，您可以創建不同的動畫效果，同時設置animation-iteration-count屬性來控制動畫的循環次數。無限時長的CSS動畫可以為您的網站帶來更多的互動和吸引力，讓您的用戶留下更長時間的印象。