Html 如何使CSS中逐渐变化的背景变得不可中断？

我的CSS是这样的（借助于）：

div[class=“heading”]{
动画：颜色更改50秒；/*动画名称后跟持续时间（秒）*/
/*您还可以使用毫秒（ms）或类似2.5s的时间*/
-webkit动画：颜色更改50s；/*Chrome和Safari*/
}
@关键帧颜色更改
{
0%{背景：#e55f5f；}
25%{背景：黄色；}
50%{背景：#55CE91；}
75%{背景：#5fe5e5；}
100%{背景：#ce71ae；}
}
@-webkit关键帧颜色更改/*Safari和Chrome-必要复制*/
{
0%{背景：#e55f5f；}
25%{背景：黄色；}
50%{背景：#55CE91；}
75%{背景：#5fe5e5；}
100%{背景：#ce71ae；}
}

这里有一些示例文本。。。

您可以将

无限

添加到css中的

动画

：

div[class=“heading”]{
动画：colorchange 3s infinite；/*动画名称后跟持续时间（秒）*/
/*您还可以使用毫秒（ms）或类似2.5s的时间*/
-webkit动画：色彩变化3s无限；/*Chrome和Safari*/
}
@关键帧颜色更改
{
0%{背景：#e55f5f；}
25%{背景：黄色；}
50%{背景：#55CE91；}
75%{背景：#5fe5e5；}
100%{背景：#ce71ae；}
}
@-webkit关键帧颜色更改/*Safari和Chrome-必要复制*/
{
0%{背景：#e55f5f；}
25%{背景：黄色；}
50%{背景：#55CE91；}
75%{背景：#5fe5e5；}
100%{背景：#ce71ae；}
}

这里有一些示例文本。。。

定为3秒，因为我不想等待10秒才能看到循环。@PhiterFernandes:）当然，没问题。我把原来的

50s

改成

10s

：）没有注意到。该死的50块钱。这很有帮助：）我一定会接受这个答案并继续投票