使用CSS的:active伪类可实现点击反馈，如变暗下移、波纹扩散或缩放效果，提升交互体验。
点击按钮时添加视觉反馈能提升用户体验，让用户清楚知道操作已被响应。通过 CSS 可以轻松实现一些简单但效果明显的点击反馈动画，不需要 JavaScript 也能完成。
1. 使用 :active 伪类实现按下效果
最基础的方式是利用 :active 伪类，它在用户点击按钮时生效。
示例：让按钮在被按下时变暗并轻微下移，模拟“按下去”的感觉。
2. 添加点击波纹效果（Ripple Effect）
更现代的反馈方式是点击时从点击位置扩散出一个波纹动画。这需要一点结构和 CSS 配合。
立即学习“前端免费学习笔记（深入）”；
实现思路：- 给按钮设置 position: relative
- 用 ::after 伪元素创建波纹层
- 点击时显示并放大透明圆形
3. 缩放反馈（Scale Effect）
点击时轻微缩小按钮，释放后回弹，带来轻盈的交互感。
基本上就这些。选择哪种动画取决于你的设计风格。简单的颜色变化 + 位移适合大多数场景，波纹适合突出操作感，缩放则更轻巧。合理使用 transition 配合 :active，就能做出自然的点击反馈。
