Html 如何在每次迭代之间添加动画延迟

我已经应用了一个“无限”的迭代，使代码永远重复，但是没有延迟，如何在每次重复之间添加延迟

.type{
宽度：最大含量；
}
.h1型{
动画：输入3s步骤（31）无限；
动画延迟：2s；
溢出：隐藏；
空白：nowrap；
右边框：2倍纯黑；
}
@关键帧键入{
0%{
宽度：0%；
}
100%{
宽度：100%；
}
}

爱好、目标和抱负

您只需在@keyframes规则中添加一个50%的关键帧，并使其

宽度：100%

，然后将动画持续时间增加到当前持续时间的两倍。这样，如果是6秒，那么在无限循环再次以0%开始之前，将有3秒的暂停

.type{
宽度：最大含量；
}
.h1型{
动画：输入6s步骤（31）无限；
动画延迟：2s；
溢出：隐藏；
空白：nowrap；
右边框：2倍纯黑；
宽度：0；
}
@关键帧键入{
0%{
宽度：0%；
}
50%, 100% {
宽度：100%；
}
}

爱好、目标和抱负