参考网站安装 - Tailwind CSS 中文网
号称是开始使用 Tailwind CSS
通过 npm 安装 tailwindcss，并创建你的 tailwind.config.js 文件。
npm install -D tailwindcss
npx tailwindcss init在 tailwind.config.js 文件中添加所有模板文件的路径。
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
plugins: [],
}将 Tailwind 指令添加到你的 CSS
@tailwind base;
@tailwind components;
@tailwind utilities;启动 Tailwind CLI 构建进程
运行 CLI 工具以扫描模板文件中的类并构建 CSS。
npx tailwindcss -i ./src/input.css -o ./src/output.css --watch
开始在你的 HTML 中使用 Tailwind
将已编译的 CSS 文件添加到 <head> 并开始使用 Tailwind 的工具类来设置内容的样式。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="./output.css" rel="stylesheet">
</head>
<body>
<h1 class="text-3xl font-bold underline">
Hello world!
</h1>
</body>
</html>
