UTILITY WORKBENCH / 01

工具类积木实验台

一次只改一个刻度,观察类名、视觉结果和对应 CSS 如何同步变化。重点不是背类名,而是读懂它们稳定的命名规律。

当前方案:均衡

同一张内容票据,换不同工具类

虚线框表示可用画布,彩色区域才是正在修改的元素。

实时预览

本周实验记录

把“看起来差不多”变成稳定刻度

A-17

传统 CSS 里随手写下的 15px、17px、19px,很容易让间距越长越乱。Tailwind 把常用取值收进同一套刻度:你仍然能做变化,但每次选择都有依据。

尚未标记

当前 class

mx-auto max-w-md border-2 border-slate-900 bg-amber-50 p-4 shadow-[7px_7px_0_#0f172a]
p-4
padding: 1rem
max-w-md
max-width: 28rem
text-base
font-size: 1rem
bg-amber-50
background-color: amber-50