Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.

Tailwind CSS 中文网

Day 1：只学 10 个 Tailwind 基础类（立刻能做布局）

你不需要先学 CSS，只要理解这 10 个高频类名：

📌 练习：做一个按钮

<button class="px-4 py-2 bg-blue-500 text-white rounded-lg">按钮</button>

数字 × 4 ≈ 像素值； p-4 代表 padding 16px

Tailwind 的字体大小也有一套固定刻度，text-xl 对应的是 1.25rem（≈ 20px）。

📘 Tailwind 常用文字大小速查表（建议收藏）

你会发现：

Tailwind 的所有字体都是在 16px 基础上按固定比例扩展。

Day 2：Tailwind 的布局（Flex）= Win

CSS 最难的是布局，Tailwind 让它变简单。

重点类名：

📌 练习：做一个 Header