重复多个css动画
我已经为4行文本创建了文本淡入淡出动画。 这些线条一个接一个地出现，到目前为止，还可以。 现在，它被要求对所有这些动画进行无限循环。 因为我是css动画的新手，我真的不知道如何处理这个问题。 我想我可能把整件事都搞错了。但如何重建它，使我有一个无限的动画全部4行 谢谢你的提示 PS：我附上了代码片段，这是为那些喜欢以下内容的人准备的提琴： PS2：我的问题与5年前另一位用户提出的另一个问题非常接近或相似，但那个问题没有得到答案。这就是为什么我今天在这里问我的问题。至少我得到了一个有用的答案 身体{ 字体大小：62.5%； 字体系列：Arial； } .动画盒{ 宽度：75%； 高度：30雷姆； 背景色：深蓝色； 保证金：0自动； 溢出：隐藏； 位置：相对位置； } @关键帧淡入淡出{ 0% { 不透明度：0； } 45% { 不透明度：1； } 100% { 不透明度：0%； } } .动画框h1{ 位置：绝对位置； 左：5%； 排名：0； 字号：4em； 颜色：白色； 字体大小：400； } .第一线， .二线， .第三行， .第四行{ 字号：3em； 位置：绝对位置； 左：5%； 最高：20%； 不透明度：0； 颜色：RGBA200200,0.9； } .第一行{ 动画名称：fadeInOut； 动画持续时间：5s； } .第二行{ 动画名称：fadeInOut； 动画延迟：5s； 动画持续时间：5s； } .第三行{ 动画名称：fadeInOut； 动画延迟：10秒； 动画持续时间：5s； } .第四行{ 动画名称：fadeInOut； 动画延迟：15秒； 动画持续时间：5s； } 渐行渐远 这是一号线 第二行来了 3是完美的数字 最后一个是4 它是如何工作的 1：动画持续时间/元素数量=动画延迟 2：您需要根据需要调整关键帧动画。这可能会有所不同。你需要对每个元素和时间间隔的时间外观有直觉 3：并添加动画迭代次数：无限；到您的个人元素 身体{ 字体大小：62.5%； 字体系列：Arial； } .动画盒{ 宽度：75%； 高度：30雷姆； 背景色：深蓝色； 保证金：0自动； 溢出：隐藏； 位置：相对位置； } @关键帧淡入淡出{ 0% { 不透明度：0； } 2% { 不透明度：0； } 5% { 不透明度：1； } 17% { 不透明度：1； } 19% { 不透明度：1； } 24% { 不透明度：0； } 80% { 不透明度：0； } 100% { 不透明度：0； } } .动画框h1{ 位置：绝对位置； 左：5%； 排名：0； 字号：4em； 颜色：白色； 字体大小：400； } .第一线， .二线， .第三行， .第四行{ 字号：3em； 位置：绝对位置； 左：5%； 最高：20%； 不透明度：0； 颜色：RGBA200200,0.9； 动画名称：fadeInOut； 动画迭代次数：无限； } .第一行{ 动画持续时间：12秒； } .第二行{ 动画延迟：3s； 动画持续时间：12秒； } .第三行{ 动画延迟：6秒； 动画持续时间：12秒； } .第四行{ 动画延迟：9秒； 动画持续时间：12秒； } 渐行渐远 这是一号线 第二行来了 3是完美的数字 最后一个是4 它是如何工作的 1：动画持续时间/元素数量=动画延迟 2：您需要根据需要调整关键帧动画。这可能会有所不同。你需要对每个元素和时间间隔的时间外观有直觉 3：并添加动画迭代次数：无限；到您的个人元素 身体{ 字体大小：62.5%； 字体系列：Arial； } .动画盒{ 宽度：75%； 高度：30雷姆； 背景色：深蓝色； 保证金：0自动； 溢出：隐藏； 位置：相对位置； } @关键帧淡入淡出{ 0% { 不透明度：0； } 2% { 不透明度：0； } 5% { 不透明度：1； } 17% { 不透明度：1； } 19% { 不透明度：1； } 24% { 不透明度：0； } 80% { 不透明度：0； } 100% { 不透明度：0； } } .动画框h1{ 位置：绝对位置； 左：5%； 排名：0； 字号：4em； 颜色：白色； 字体大小：400； } .第一线， .二线， .第三行， .第四行{ 字号：3em； 位置：绝对位置； 左：5%； 最高：20%； 不透明度：0； 颜色：RGBA200200,0.9； 动画名称：fadeInOut； 动画迭代次数：无限； } .第一行{ 动画持续时间：12秒； } .第二行{ 动画延迟：3s； 动画持续时间：12秒； } .第三行{ 动画延迟：6秒； 动画持续时间：12秒； } .第四行{ 动画延迟：9秒； 动画持续时间：12秒； } 渐行渐远 这是一号线 第二行来了 3是完美的数字 最后一个是4重复多个css动画,css,css-animations,Css,Css Animations,我已经为4行文本创建了文本淡入淡出动画。 这些线条一个接一个地出现，到目前为止，还可以。 现在，它被要求对所有这些动画进行无限循环。 因为我是css动画的新手，我真的不知道如何处理这个问题。 我想我可能把整件事都搞错了。但如何重建它，使我有一个无限的动画全部4行 谢谢你的提示 PS：我附上了代码片段，这是为那些喜欢以下内容的人准备的提琴： PS2：我的问题与5年前另一位用户提出的另一个问题非常接近或相似，但那个问题没有得到答案。这就是为什么我今天在这里问我的问题。至少我得到了一个有用的答案 身
可能的复制品可能，是的，至少看起来很相似。但是这个问题没有得到正确的答案。希望这一个可能的复制品会更好，是的，至少看起来很相似。但是这个问题没有得到正确的答案。希望过得更好
这正是我所希望的结果。非常感谢你的帮助！但不幸的是，我仍然不明白它是如何工作的。。。你能解释得更详细一点吗？动画持续时间是一个动画的整个长度。动画延迟是指它进入/退出时的延迟。然后，当你的动画淡入淡出时，整个动画的关键帧就会设置。@JonSnow尝试添加几行解释，希望这能消除你的疑虑。这正是我所希望的结果。非常感谢你的帮助！但不幸的是，我仍然不明白它是如何工作的。。。你能解释得更详细一点吗？动画持续时间是一个动画的整个长度。动画延迟是指它进入/退出时的延迟。然后，当您的动画淡入淡出时，整个动画的关键帧就会设置。@JonSnow尝试添加几行解释，希望这能消除您的疑虑。