# 创建一个项目目录，如 tailwind，通过终端进入
cd tailwind
# 通过 npm 安装 tailwind
npm install -D tailwindcss
# 初始化
npx tailwindcss init打开 tailwind.config.js，添加您的 html js php 等视图路径，用于开发过程的动态编译。
const colors = require('tailwindcss/colors')
module.exports = {
content: [
"./*.{html,js,php}",
],
plugins: [],
}通过 content 属性配置您的视图路径，正则模式的文件或者文件夹路径；
# 创建一个自己的 css 文件，如 input.css
# 编写以下代码后保存
@tailwind base;
@tailwind components;
@tailwind utilities;命令行或者终端执行
npx tailwindcss -i ./input.css -o ./output.css --watchinput.css 为开发者编写样式的文件，添加、修改样式时改变此文件会自动生成 output.css。
output.css 为最终编译结果样式文件， html 模板中使用此文件。
创建 html 或者视图文件，引入 output.css 并使用。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>tailwind</title>
<link rel="stylesheet" href="output.css" />
</head>
<body>
<div
class="w-full text-center">
hi...
</div>
</body>
</html>如果可以看到文本居中效果，那么证明您的安装及初始化工作已经成功。
系统会监听 html 及模板代码变化，会自动编译生成所需的 css 样式。
