vscode 默认不运行html、不自动补全或预览，仅编辑；!+tab无效因emmet未启用或语言模式错误，需确保emmet.triggerexpansionontab为true且语言模式为html。
VSCode 本身不运行 HTML，也不自动补全或预览——它只编辑；补全和预览都靠配置和插件协同完成。开箱即用状态下，! + Tab 不生效、双击打开是白屏、改完保存没刷新，全是默认行为，不是你搞错了。
为什么 ! + Tab 没反应？检查 Emmet 和语言模式
这不是 HTML 补全“坏了”，而是 Emmet 缩写展开逻辑没触发。VSCode 的 HTML 标签补全核心依赖 Emmet，不是纯语言服务。
-
emmet.triggerExpansionOnTab必须为true（否则按Tab不展开div>ul>li*3） -
emmet.showExpandedAbbreviation推荐设为"inMarkupAndStylesheetFiles"（设为"never"就连输入<di> 都不提示 <code><div>） <li>右下角状态栏必须显示 <code>HTML—— 如果是Plain Text或JavaScript，Emmet 完全不工作 - 确保
html.suggest.html5为true，否则语义化标签如<main></main>、<aside></aside>不出现 - 唯一靠谱的预览方式是起本地 HTTP 服务，推荐安装
Live Server（作者 Ritwick Dey，下载量最高） - 装好后右键
index.html→Open with Live Server，自动打开http://localhost:5500/index.html - 端口被占时它会自动递增（
:5501、:5502），不用手动改livePreview.portNumber - 别选
ms-vscode.live-server（微软官方版），那是旧版已归档，功能不全 - 确保项目根目录下有
css/或style.css，且文件内定义了类名（如.btn-primary） -
css.languageService.enabled必须为true（VSCode 1.80+ 默认开启） - 如果用的是
.vue单文件组件，class补全需 Volar 插件支持，原生 HTML 设置无效 - 禁用 Prettier 等格式化插件的“onType”格式化，否则输到一半就自动换行，打断补全弹窗
改完 settings.json 后，执行 Ctrl+Shift+P → 输入 Reload Window 重载，别只重启编辑器。
为什么双击 HTML 文件打不开样式/JS？必须走 HTTP 协议
直接双击或用 file:/// 打开会触发浏览器安全策略：相对路径（./css/style.css）、fetch()、XMLHttpRequest 全部被拦截，控制台报 CORS 错误。
为什么 class 属性里不提示 CSS 类名？需要 CSS 语言服务联动
HTML 中的 class=""、href="" 补全不是 HTML 插件单独负责的，它要读取项目里的 CSS/JS 文件结构。
最常被忽略的点：补全和预览是两套独立机制，一个配错不影响另一个，但用户常以为“装了 Live Server 就该自动补全”。实际它们分别由 Emmet、HTML 语言服务、CSS 语言服务、Live Server 插件各自驱动，出问题得逐层排查，不能只看“插件装了没”。
