emmet 输入 class 时不生成双引号和空格是因为其语法要求 class 间用英文点号连接（如 div.a.b），空格或逗号会导致错误；类名补全需正确设置语言模式、安装对应插件（如 html css support 或 tailwind css intellisense）并启用 editor.quicksuggestions.strings 等关键配置。
Emmet 输入 class 时为什么没生成双引号和空格
因为 Emmet 默认只认 div.class1.class2 这种写法，中间不能有空格、逗号或连字符。写成 div.class1 .class2（带空格）会生成两个独立标签；div.class1,class2（逗号）则完全不识别。
正确做法是：确保文件语言模式为 HTML（右下角状态栏确认），然后直接输入 div.flex.justify-center，按 Tab 或 Enter 即可生成 <div class="flex justify-center"></div>。
- 多个 class 必须用英文点号
.连接，不能用中文标点或空格 - 类名含短横线（如
bg-blue-500）无需转义，Emmet 原生支持 - 如果没反应，先检查语言模式——在
.js或.txt文件里敲div.a.b不会展开，这不是插件坏了，是设计如此
HTML 中 class 属性里输一半，怎么自动补全项目里的类名
VS Code 默认不扫描 CSS 文件，所以 class="btn" 后不会提示 btn-primary。要让它“知道”你写了哪些类，得靠插件解析并索引。
推荐装 HTML CSS Support（微软官方维护）或 IntelliSense for CSS class names in HTML。前者更稳定，后者对 SCSS/Less 支持略好。
- 安装后默认扫描项目根目录下所有
*.css、*.scss、*.less文件 - 需手动开启两个设置：
editor.suggest.showClasses设为true，editor.quickSuggestions.strings也设为true - 若用 Tailwind，必须有
tailwind.config.js，否则插件只认你 CSS 文件里真写的类，不认识hover:bg-gray-100这类工具类
Tailwind 类名输到一半，怎么让 VS Code 自动列出来
装 Tailwind CSS IntelliSense 插件，并确保项目里有生效的 tailwind.config.js。它不依赖你是否写了 CSS 文件，而是读配置 + 扫描模板路径来推导可用类名。
比如你在 class="m" 后按 Ctrl+Space（Mac 是 Cmd+Space），就会弹出 ml-2、mb-4、max-w-screen 等匹配项。
- 插件对
@layer、theme.extend、自定义plugins都支持，前提是配置文件里声明了它们 - 它只管 Tailwind 类，混用原生 CSS 类（如
my-button）时，得另外装HTML CSS Support来补全 - 如果提示不全，检查
content字段是否覆盖了你的 HTML/JSX 文件路径，例如：content: ["./src/**/*.{html,js,jsx,ts,tsx}"]
想给已有标签快速加 class，但不想删掉重写
别删标签，用光标定位到 class="" 的引号内，直接输入。这时候上面说的类名补全插件就起作用了。
如果当前没有 class 属性，可以手敲 class=""，再把光标放进双引号里——只要设置了 editor.quickSuggestions.strings: true，就会自动触发建议列表。
- 已存在
class="existing"？把光标放在引号内末尾，输空格再敲新类名，补全会接着弹 - 用
Auto Rename Tag插件能避免改错闭合标签，但它不管 class 内容，只管标签名本身 - 动态 class（如 Vue 的
:class或 React 的className={\`x \${y ? 'z' : ''}\`}）无法被任何补全插件识别，那是运行时逻辑，不是静态字符串
tailwind.config.js 或没开 editor.quickSuggestions.strings。这两个开关一关，补全功能就哑火，但错误提示又不明显——你只会觉得“怎么又不提示了”。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
