应将自定义间距键名写入 theme.spacing 而非 theme.extend.spacing，因后者仅支持覆盖已有键、不支持新增键名；键名需合法（如 '1_5'），值须为静态字符串（如 '0.375rem'），且修改后需重启开发服务器。
直接改 theme.spacing，别碰 extend.spacing —— 后者加不了新键名，写了也白写。
为什么 mt-1_5 写了但没效果？
常见错误现象：mt-1_5 类在 HTML 里写了，浏览器 computed 样式里压根找不到对应规则，控制台也无报错，纯静默失效。
- 根本原因：键名写在了
theme.extend.spacing下，而 Tailwind 只从theme.spacing读取新键名；extend.spacing只能覆盖已有键（比如把'4'的值从'1rem'改成'1.25rem'），不能新增'1_5'这种键 - 键名非法也会静默跳过：写
'1.5'→ JS 解析为数字字面量，类名mt-1.5不合法；含空格、斜杠、中文同理 - 值不是静态字符串（如用了
calc()或模板字符串）→ JIT 编译阶段直接忽略，不报错也不生成 CSS
怎样安全添加一个自定义间距值？
正确位置和写法必须同时满足：
- 写在
tailwind.config.js的module.exports.theme.spacing对象里，不是extend - 键名用下划线或语义词：
'1_5'（生成mt-1_5）、'quarter'（生成mb-quarter） - 值是静态字符串，带明确单位：
'0.375rem'✅，'8px'✅，'10vh'✅；'10%'⚠️（上下文依赖），calc(1rem - 2px)❌ - 改完必须重启开发服务器——热更新不监听 config 变更
只想微调几个默认值，其他保持不变？
不能只写想改的那几项。Tailwind 会用你写的 theme.spacing 完全替换内置 spacing 系统，漏掉的键（比如没写 '2'）会回退到内置值，导致比例断裂。
立即学习“前端免费学习笔记（深入）”；
- 安全做法：复制默认 spacing 配置（见官方文档或 node_modules/tailwindcss/defaultTheme.js），再局部修改你需要的项
- 例如只想把
'6'从'1.5rem'改成'1.75rem'，就得把'0'到'64'全列出来，只动那一行 - 若用函数式配置如
spacing: (n) => `${n * 4}px`，注意小数参数是否被支持（space-y-0.5可能不生效）
响应式间距容易漏掉的基础值
Tailwind 是移动优先，断点类按顺序覆盖。如果只写 md:space-y-6，小屏下实际是 space-y-0（因为未声明基础值）。
- 必须显式设最小断点：
space-y-2 sm:space-y-4 md:space-y-6 - 动态拼接类名（如
class="space-y-${size}"）时，size的取值必须在构建时可静态分析，否则对应 CSS 不会生成 - 调试优先看浏览器 computed 样式里哪条规则生效，比猜更快
真正麻烦的从来不是“怎么写类名”，而是父容器 display 模式、默认 margin 干扰、键名非法却无提示——这些地方一错，就只剩 silent fail。
