Animate.css

Animate.css 是一个纯 CSS 的动画库，把常见的入场、退场和强调动效预先写成 keyframes 和类名。网页里想让标题弹一下、弹窗淡入、图片滑进来，不用自己写动画曲线，给元素加上对应的类就能动起来。它面向写前端的人，不需要 JavaScript 也能用。

怎么用

通过 npm 或 Yarn 安装后 import 进项目，也可以直接在页面里引 CDN 上的 animate.min.css。使用时给元素加 animate__animated 前缀类，再加动画名，比如 animate__bounce，元素就会播放对应效果。文档里每个动画名旁边都有复制按钮，点一下就能拿到类名。

除了现成类名，也可以只取库里的 @keyframes，接到自己已有的动画声明上，避免和项目里的类名冲突。

动画种类

页面按用途分组列出动画：Attention seekers 有 bounce、flash、pulse、shakeX、heartBeat 等；入场和退场各有 Back、Bouncing、Fading、Rotating、Zooming、Sliding 几组，方向分上下左右；另外还有 Flippers、Lightspeed 和 hinge、jackInTheBox、rollIn 这类 Specials。

费用与注意

库本身开源免费，文档站也不需要登录。当前文档对应 v4，从 v3.x 及更早版本升级有破坏性改动，需要先看迁移指南。官方也提醒动画可能干扰用户，建议先读最佳实践和无障碍相关章节再上生产。