Tailwind CSS v3.4是唯一支持容器查询的v3主版本，v3.3及更早版本完全无效；必须同时满足四条件：版本≥3.4.0、启用experimental.containerQueries开关、安装并注册@tailwindcss/container-queries插件、HTML元素添加container类、@container规则置于@layer内，缺一不可。
Tailwind CSS v3.4 是唯一支持容器查询的 v3 主版本，v3.3 及更早版本无论怎么配都无效；必须同时启用实验开关、安装插件、加 container 类、把 @container 写进 @layer，缺一不可。
确认你用的是 Tailwind v3.4+
运行 npm list tailwindcss 或检查 package.json，确保版本号 ≥ 3.4.0。v3.3.x 即使写了 experimental.containerQueries: true 也完全不解析 @container 规则——这不是配置问题，是版本硬限制。
tailwind.config.js 必须显式启用实验开关
experimental.containerQueries: true 这行必须直接写在配置对象的根层级，不能嵌套在 theme、plugins 或其他字段下：
module.exports = {
experimental: { containerQueries: true }, // ✅ 正确位置
theme: { /* ... */ },
plugins: [ /* ... */ ],
}常见错误：
立即学习“前端免费学习笔记（深入）”；
- 把它写成
theme.experimental或plugins.experimental—— PostCSS 插件根本读不到 - TypeScript 用户没装
@types/node，导致require()报错
安装并注册 @tailwindcss/container-queries 插件
只装不注册，或只注册不装，都会静默失效：
- 运行
npm install -D @tailwindcss/container-queries（pnpm add -D或yarn add -D同理） - 在
tailwind.config.js的plugins数组中写require('@tailwindcss/container-queries')，不能写字符串'@tailwindcss/container-queries' - Django Tailwind 用户优先用
python manage.py tailwind plugin_install @tailwindcss/container-queries，它会自动处理注入
@container 规则必须在 @layer 内，且 HTML 元素要带 container 类
这两步漏掉任意一个，DevTools 里都看不到生成的 CSS：
-
@container必须包裹在@layer components { }或@layer utilities { }中，写在全局 CSS 顶层会被跳过 - HTML 中必须显式加
class="container"（或你自定义的容器类名），仅靠max-w-4xl或flex不行 - 容器本身要有可测宽度：如果父级是
flex且没设max-w-或w-full，计算出的inline-size往往为0，min-width条件永远不满足
调试时最常被忽略的点：容器元素在 DevTools 的 Computed 面板里，container-type 字段是否真实存在、inline-size 是否 ≥ 查询阈值——不是语法错了，而是容器压根没“活”起来。
