答案：CSS可通过animation-name用逗号分隔多个动画，并与duration、timing-function等属性按序对应，推荐使用animation简写形式，如animation: slideIn 1s ease-out, fadeIn 2s linear, rotate 0.5s ease-in infinite；多个动画默认同时开始，可借助animation-delay控制时机，属性顺序需一致以避免错位。
可以，CSS 的 animation-name 属性支持同时应用多个动画。
如何使用多个动画名称
只需在 animation-name 中用逗号分隔多个动画名称即可。每个名称对应一个 @keyframes 定义，并且其他 animation 属性（如 duration、timing-function 等）也需按顺序用逗号分隔，与每个动画一一对应。
示例：
.element {
animation-name: slideIn, fadeIn, rotate;
animation-duration: 1s, 2s, 0.5s;
animation-timing-function: ease-out, linear, ease-in;
animation-iteration-count: 1, 1, infinite;
}
上面的代码为元素同时应用了三个动画：
- slideIn：持续 1 秒，ease-out 缓动，执行 1 次
- fadeIn：持续 2 秒，线性变化，执行 1 次
- rotate：持续 0.5 秒，ease-in 缓动，无限循环
简写形式更常用
通常建议使用 animation 简写属性，让代码更清晰：
立即学习“前端免费学习笔记（深入）”；
.element {
animation:
slideIn 1s ease-out,
fadeIn 2s linear,
rotate 0.5s ease-in infinite;
}
注意事项
多个动画会同时开始播放，除非通过 animation-delay 设置不同的延迟。如果某个动画不需要重复，记得设置 animation-iteration-count: 1 或省略（默认为 1）。
确保每个动画的属性值顺序一致，避免错位导致效果异常。
基本上就这些，合理使用多动画能让界面更生动。
