Skip to content

Tailwind:把 CSS 写成组合类名

html
<button class="px-4 py-2 bg-blue-600 text-white rounded-lg">
类名人话
px-4左右内边距
py-2上下内边距
bg-blue-600蓝色背景
text-white白色文字
rounded-lg较大圆角

读长 className 时分组:布局 → 尺寸 → 间距 → 文字 → 颜色 → 状态。不要逐个背。

mt-4 和 pt-4 分别是什么?

答案:mt-4 是顶部外边距 margin-top;pt-4 是顶部内边距 padding-top。

写给想驾驭 AI,而不只是依赖 AI 的 Vibe Coder。