如何循环播放关键帧 css 彩色动画？ [复制]

Question

我希望我的 css 动画每秒循环一次背景颜色，但我不知道如何让它循环？我只想知道如果没有 javascript 这是否可行。如果不是，那也没关系。

body {
    background-repeat: no-repeat;
    background-size: cover;
    font-family: 'Roboto', sans-serif !important;
    position: relative;
    animation-name: color;
    animation-duration: 6s;
}
@keyframes color {
    0% {background-color: white;}
    20% {background-color: green;}
    40% {background-color: aqua;}
    60% {background-color: red;}
    80% {background-color: yellow;}
    100% {background-color: purple;}
}

Answer 1

body {
    background-repeat: no-repeat;
    background-size: cover;
    font-family: 'Roboto', sans-serif !important;
    position: relative;
    animation-name: color;
    animation-duration: 6s;
    animation-iteration-count:infinite; /* add this line */
}