Html 赢得多个文本CSS动画'；不要在指定的时间开始

我正在使用css文本动画创建登录页。
我想让几行文字依次出现。
每段文本应渲染2秒，并在前一行文本不再渲染后开始渲染。
我遇到的问题是，
文本呈现为不透明，然后进入动画开始时间和持续时间。
我希望在页面加载时播放动画，
不渲染（左侧或顶部：-300px，）
并在第一个动画停止后进行渲染

我尝试了各种属性，如动画延迟、持续时间和易用性，但都无济于事

.header设置工作组动画{
位置：相对位置；
动画：标题动画工作组2；
动画填充模式：正向；
}
@关键帧标题动画wg{
0%{不透明度：0；顶部：-300px；}
50%{不透明度：1；顶部：0；}
75%{不透明度：1；顶部：0；}
90%{不透明度：0.2；顶部：0；}
100%{不透明度：0；}
}
.header设置即时消息的动画{
位置：相对位置；
动画：标题动画im；
动画持续时间：2秒；
动画填充模式：正向；
}
@关键帧标题动画im{
0%{不透明度：0；左：-300px；}
90%{不透明度：1；}
100%{不透明度：0；}
}
.让我动起来{
位置：相对位置；
动画：标题动画我2；
动画填充模式：正向；
}
@关键帧标题为我设置动画{
0%{不透明度：0；左：-300px；}
90%{不透明度：1；}
100%{不透明度：0；}
}

多好啊！
我是
名称

拆分动画以输入动画，然后退出动画。现在，您可以使用

动画延迟

（第四个参数，在

向前

或

两者之后）来安排动画：


.header设置工作组动画{
位置：相对位置；
动画：标题动画向前输入前1，
标题动画离开淡入1s向前3s；
}
.标题动画{
位置：相对位置；
}
.header设置即时消息的动画{
动画：标题动画输入左1和左1，
标题动画离开淡入1s向前4s；
}
.让我动起来{
动画：标题动画输入左1s两个2s，
标题动画离开淡入1s向前5s；
}
@关键帧标题动画输入顶部{
从{top:-100px；不透明度：0}
到{顶部：0；不透明度：1；}
}
@关键帧标题动画输入左{
从{左：-100px；不透明度：0；}
到{左：0；不透明度：1；}
}
@关键帧标题设置离开淡入淡出动画{
从{opacity:1；}
到{不透明度：0；}
}
}

多好啊！
我是
名称
这就是我想要实现的目标。谢谢我在看一个关于css动画的lynda课程，它没有涵盖代码片段中的某些属性/值，比如“离开淡入淡出”。你用什么课程或在线教程来学习css动画？离开淡出只是一个方便的名字。我很久以前就学会了动画。一些来自，和其他课程，但主要来自玩动画，检查网络上的动画有多有趣，等等。。。