Tailwind CLI
从零开始使用 Tailwind CSS,最简单、最快的方式是 Tailwind CLI 工具。如果你不想安装 Node.js,也可以使用独立可执行文件。
安装 Tailwind CSS
通过 npm 安装 tailwindcss 和 @tailwindcss/cli。
在 CSS 中导入 Tailwind
在主 CSS 文件中添加 @import "tailwindcss";。
启动 Tailwind CLI 构建
在 HTML 中使用 Tailwind
将已编译的 CSS 文件加入 <head>,然后使用 Tailwind 的工具类为内容添加样式。
src/index.html
html<!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>