细节与特效 · 耐看的小细节
裁剪路径Clip-path
- 干净
- 有方向
- 利落
用一个形状决定元素哪些部分可见，没显示的部分像被刀切掉一样，常用来做擦除和揭示。
什么时候用它
需要按方向扫出、擦除内容时用它；只是改变自身形状用“形变”更简单。
参数
clip-path: inset(0 0 100% 0)→inset(0) · 400ms ease-out
配方
裁剪路径 → clip-path inset(0 0 100% 0) → inset(0) @ 400ms ease-out
给 AI 的一句话
用 clip-path 做这段内容的擦除揭示：从 inset(0 0 100% 0) 展开到 inset(0)，自下而上露出，400ms、ease-out。