我有一个svg容器div，其中包含多个svg文本，以使用css关键帧将第一个文本设置为淡出，将第二个文本设置为淡入。我想知道是否可以将整个动画设置为无限播放？
<html>
<div id="fading">
<svg>
<text class="fadingA" x="20%" y="50%">Follow Me</text>
<text class="fadingB" x="13%" y="50%">On Social Media</text>
</svg>
.fadingA{
font-size: 100px; fill:#BFAE99;
stroke: #171F26; stroke-width:3px;
stroke-dasharray: 352.6px;
animation: animate1 3s ease forwards;
}
.fadingB{
font-size: 100px; fill: transparent;
stroke: #171F26; stroke-width:3px;
stroke-dasharray: 457.7px;
stroke-dashoffset: 457.7px;
animation: animate2 3s ease forwards;
animation-delay: 3s;
}
@keyframes animate1{
to{
stroke-dashoffset: 352.6px;
fill: transparent;
}
}
@keyframes animate2 {
to{
stroke-dashoffset:0px;
fill:#BFAE99;
}
}