Q44
★ ★ ★ ★ ★
如何看待 Atomic CSS？
⚡ 速记答案（30 秒）
一类一义：每个类只负责一条样式，组合类构建 UI。优点：高度复用、体积小、统一设计 Token。缺点：HTML 类名多，可读性差；团队需要统一约定。结论：规模化团队+统一设计系统时收益最大。
📖 详细讲解
标准面试回答（推荐记住）
Atomic CSS 或者叫原子化 CSS，核心思想是每个类只负责一条样式，比如 .mt-4 只设置 margin-top: 1rem，.flex 只设置 display: flex。构建 UI 时组合这些原子类。优点是复用率极高、最终 CSS 体积小、设计 Token 统一。缺点是 HTML 类名很多，看起来乱，团队需要统一约定和学习成本。在规模化团队配合统一设计系统的场景下收益最大，小项目可能得不偿失。
✅ 面试要点
- •每个类只负责一条样式
- •高复用、小体积
- •规模化团队收益大