vs code html缩进问题根源在于配置冲突：需确保文件为.html后缀、语言模式设为html、"html.format.enable":true启用；editor.tabsize控制手动缩进宽度，html.format.indentinnerhtml决定根标签子元素是否缩进；prettier推荐设htmlwhitespacesensitivity为"css"；内容需css控制white-space并转义标签；禁用editor.detectindentation以统一空格缩进。
HTML 缩进不是浏览器要求的，而是人需要的——不缩进的代码能跑，但没人想改。
VS Code 里按 Shift + Alt + F 没反应？检查这三件事
快捷键失效不是 bug，大概率是配置没对上：
- 文件后缀必须是
.html或.htm，否则编辑器不会启用 HTML 格式化服务 - 右键编辑区空白处，确认菜单里有“格式化文档”选项；如果没有，说明 HTML 语言模式未激活（可按
Ctrl + Shift + P输入Change Language Mode，选HTML） - 检查
settings.json中是否意外禁用了格式化："html.format.enable": true必须存在且为true
editor.tabSize 和 html.format.indentInnerHtml 到底管什么
这两个配置常被混用，但作用完全不同：
-
editor.tabSize控制你按Tab键时插入几个空格（或 Tab 字符显示宽度），它影响的是**手动输入行为** -
html.format.indentInnerHtml决定格式化时是否对、这类根级标签的子元素缩进，默认false，会导致和贴着左边——加成true才符合常规嵌套逻辑 - 真正控制格式化缩进宽度的是
editor.tabSize，不是html.format.*下的任何字段
Prettier 的 htmlWhitespaceSensitivity 设 "css" 还是 "strict"
这个选项决定 Prettier 如何处理标签间的空白字符，直接影响缩进后的换行和空格分布：
-
"css"（推荐）：把空白当作 CSS 中的普通空格处理，保留有意义的换行（比如<p></p>和<div> 之间留空行），适合大多数项目 <li> <code>"strict"：严格按 HTML 规范解析空白，会删掉很多你手动加的换行和缩进，导致生成的代码看起来“挤”，尤其在<pre class="brush:php;toolbar:false;"></pre>或内联文本附近容易出问题 - 别设
"ignore"：它会让 Prettier 完全跳过 HTML 空白处理，缩进可能错乱，且与 ESLint 等工具冲突 - 必须加 CSS：
white-space: pre-wrap（保留空格+自动换行）或white-space: pre-line（合并连续空格但保留换行） - 外层包一层
<div class="code-block">，再设 <code>overflow-x: auto，不然宽代码直接撑破容器 - 如果
<pre class="brush:php;toolbar:false;"></pre>里要展示 HTML 标签，比如<div>，得先转义成 <code><div>，否则浏览器真去解析它缩进最易被忽略的点：团队里只要有一台机器的
editor.detectIndentation是true，它就会偷偷读取文件首行缩进风格，然后覆盖你设好的tabSize。统一关掉它，再配editor.insertSpaces: true，才能真正锁死空格缩进。
<pre class="brush:php;toolbar:false;"></pre> 里的缩进怎么保得住
这是个典型陷阱：你往 <pre class="brush:php;toolbar:false;"></pre> 里写带缩进的 HTML 片段，结果渲染出来全是扁平的——因为 <pre class="brush:php;toolbar:false;"></pre> 只保留换行和空格，但不阻止浏览器默认样式把字体变小、边距压垮、横向溢出：
