使用 CSS 动画

CSS 动画 允许开发者将一个 CSS 样式配置平滑过渡到另一个 CSS 样式配置。每个动画包含两个关键部分：描述动画行为的样式规则，以及定义动画起点、终点和中间状态样式的关键帧。

与传统基于脚本的动画技术相比，使用 CSS 动画具有三个显著优势：

1. 创建简单动画变得异常容易，开发者无需掌握 JavaScript 即可实现动画效果。
2. 动画性能优异，即使在低配置设备上也能流畅运行。渲染引擎会采用跳帧等技术确保动画尽可能平滑。而 JavaScript 实现的动画通常表现欠佳（除非经过精心优化）。
3. 将动画控制权交给浏览器，使浏览器能够优化性能和效果，例如减少隐藏标签页中的动画更新频率。