VS Code HTML格式化失效因三类配置未对齐：语言模式须为HTML、"html.format.enable":true需启用、缩进由editor.tabSize控制且须设"editor.insertSpaces":true。
VS Code 里 HTML 格式化不按你预期缩进，不是代码写错了，而是三类配置没对齐：语言模式、格式化开关、缩进语义归属。
为什么 Shift + Alt + F 没反应？先查这三件事
快捷键失灵基本不是编辑器故障，而是底层条件没满足：
- 文件后缀必须是
.html或.htm，否则 VS Code 不加载 HTML 格式化服务 - 右键编辑区空白处，菜单里没有“格式化文档”？说明语言模式不是
HTML（按Ctrl + Shift + P输入Change Language Mode，选HTML） - 打开
settings.json，确认有"html.format.enable": true；缺了这句，整个 HTML 格式化模块就是关着的
editor.tabSize 和 html.format.indentInnerHtml 到底谁管什么？
这两个字段常被混用，但职责完全分离：
-
editor.tabSize控制你按Tab键时插入几个空格——它只影响**手动输入行为**，比如你敲 Tab 想缩进一级，它决定这一级是 2 还是 4 个空格 -
html.format.indentInnerHtml决定格式化时是否对<html>、<body>这类根级标签的子元素缩进，默认false，结果就是<head>和<body>贴着左边——设成true才符合常规嵌套逻辑 - 真正控制格式化后缩进宽度的，只有
editor.tabSize；html.format.*下的所有字段都不管缩进“多宽”，只管“缩不缩”“缩哪些”
必须设 "editor.insertSpaces": true，别用 Tab
用 Tab 缩进在协作中几乎必然出问题：
立即学习“前端免费学习笔记（深入）”；
- Git diff 显示大量“仅空格变化”，实际是不同人本地 Tab 宽度不一致（有人设 4，有人设 8）
- 复制粘贴到 Slack、GitHub 或文档时，Tab 被转成 2–8 个不等空格，结构彻底塌陷
- 浏览器渲染无差异，但人眼读代码时层级错乱——
<section>看起来比<header>多缩进一级，其实是 Tab 渲染宽度漂移 - 正确做法：全局启用
"editor.insertSpaces": true，让所有Tab键都输出空格；再配"editor.tabSize": 4，确保一级缩进恒为 4 个空格
<pre> 里的 HTML 缩进为啥保不住？
这是个典型陷阱：你在 <pre> 里写带缩进的 HTML 片段，结果渲染出来全是扁平的——因为 <pre> 只保留换行和空格，但默认样式会让字体变小、边距压垮、横向溢出。
- 必须加 CSS：
white-space: pre-wrap（保留空格 + 自动换行）或white-space: pre-line（合并连续空格但保留换行） - 外层建议包一层
<div class="code-block">，再加overflow-x: auto，不然宽代码直接撑破容器 - 注意：
tab-sizeCSS 属性只对真实\t字符起效，对空格无效；所以如果你已统一用空格缩进，tab-size就完全不用管
真正难的不是配哪几行 JSON，而是让团队所有人禁用 editor.detectIndentation——一旦有人开着这个选项，他打开一个旧文件，编辑器就自动切到 2 空格，保存时又悄悄切回 4 空格，Git 提交记录里全是缩进抖动。
