在CSS動畫中，有時候我們需要讓動畫產(chǎn)生停頓效果，或是在停頓后再次播放動畫。這篇文章將介紹如何實現(xiàn)這種效果。

/* 定義一個動畫 */
@keyframes my-animation {
0% { transform: scale(1); }
50% { transform: scale(2); }
100% { transform: scale(1); }
}
/* 使用動畫 */
.element {
animation: my-animation 2s ease-in-out;
}

上述動畫會在2秒內(nèi)不斷的執(zhí)行，但有時候我們需要讓動畫停頓一段時間后再次執(zhí)行。這可以通過使用animation-delay屬性來實現(xiàn)，該屬性定義了動畫開始前的停頓時間。

/* 在動畫開始前停頓1s */
.element {
animation: my-animation 2s ease-in-out 1s;
}

上述動畫會在1秒后開始執(zhí)行。

如果我們需要在動畫執(zhí)行完后再次播放動畫，可以通過使用animation-iteration-count屬性來實現(xiàn)。該屬性定義動畫的執(zhí)行次數(shù)。

/* 動畫執(zhí)行完后再次執(zhí)行一次 */
.element {
animation: my-animation 2s ease-in-out 1s 2;
}

上述動畫會在2秒結(jié)束后再次執(zhí)行一次。