class属性拼写错误（如clas、classname）导致浏览器忽略整个class属性，使所有tailwind工具类失效；content路径未覆盖文件、方括号语法空格/引号错误、不支持前缀的任意值及jit未启用，均会导致任意值类名不生效。
class属性拼写错误是最常见原因
不是Tailwind的问题，是HTML基础没写对。clas、className、classes这些写法浏览器直接忽略，整个class属性都不解析，所有工具类（包括任意值）全失效。打开开发者工具看元素DOM树，如果根本看不到class="..."这个属性，90%是这里错了。
content配置没覆盖到文件路径
Tailwind只扫描content里声明的路径，没扫到就等于没看见你写的mt-[23px]或bg-[#1e3a8a]，自然不生成CSS规则。常见错误包括：
-
content: ["./**.{html,js}"]缺引号，Node环境可能解析失败 -
content: ["'./src/**/*.{js,jsx}'"]多了一对单引号，路径无效 - 用Vite/Next.js却只配了
./**/*.html，JSX里的任意值类名压根不扫描
检查构建后的CSS文件里有没有.mt-\[23px\]这类规则，没有就是content漏了。
方括号语法本身写错了
[value]看着简单，但空格、连字符、引号一个不对就静默失效：
-
text-[ #333 ]→ 开头/结尾有空格，整个被忽略 -
grid-cols-[1fr 2fr 1fr]→ 空格没转成下划线，解析器在第一个空格处截断 -
shadow-[inset 0 0 0 1px red]→ 括号内含空格，必须写成shadow-[inset_0_0_0_1px_red]或加引号shadow-["inset 0 0 0 1px red"] -
bg-[url('/img.png')]→ 路径含括号或尖括号时需URL编码，否则Network面板会报404
前缀不支持任意值，或者JIT没启用
不是所有类名前缀都能套方括号：
-
rounded-[12px]、border-[2px]、animate-[bounce]全部无效——这些前缀走的是预设值匹配逻辑，不进JIT任意值管道 -
duration-[300ms]、shadow-[...]、text-[#333]才支持 - v2.x或v3.x里手动设了
mode: 'aot'，JIT关闭，任意值语法完全不工作
查官方文档对应工具类页的“Arbitrary values”小节，或翻tailwind.config.js里theme.extend是否定义了该前缀，比猜更可靠。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
