vs code中html格式化快捷键为ctrl+shift+i（win/linux）或cmd+shift+i（mac），部分配置下可用shift+alt+f；需确保语法合法、语言模式正确识别，并推荐配合pretterrc配置文件统一行为。
用编辑器快捷键一键格式化 Ctrl+Shift+I（VS Code）或 Shift+Alt+F（多数编辑器）
绝大多数现代编辑器（VS Code、WebStorm、Sublime Text）都内置 HTML 格式化引擎，只要代码结构合法（标签闭合、嵌套正确），按一次快捷键就能自动对齐缩进、换行、补全空格。VS Code 默认是 Ctrl+Shift+I（Windows/Linux）或 Cmd+Shift+I（Mac）；部分版本或配置下可能是 Shift+Alt+F。别先手动删空格或敲回车——格式化前确保没有语法错误，否则可能把错乱放大。
表格结构不塌陷？先检查 <table> 内部是否漏了 <code><tr> 或嵌套错层
<p>常见现象：格式化后表格在浏览器里显示错位、列宽崩坏、<code>rowspan/colspan 失效。根本原因往往不是格式问题，而是 HTML 结构本身不合法：<td> 直接放在 <code><table> 下（跳过了 <code><tr>），或 <code><thead> 里混进了 <code><tbody> 的 <code><tr>。格式化工具不会修复逻辑错误，只会让错误更“整齐地错”。务必确认：
<ul><li><code><table> → 必须只包含 <code><caption></caption>、<colgroup></colgroup>、<thead>、<code><tbody>、<code><tfoot>、<code><tr><li><code><tr> → 只能直接放在 <code><thead>/<code><tbody>/<code><tfoot> 或 <code><table> 内，不能套 <code><div> 或其他非表格标签
<li>每个 <code><tr> 下至少有一个 <code><td> 或 <code><th>，且数量一致（否则 colspan 计算会偏移）
<h3>想让格式化结果稳定？加个 <code>.prettierrc 配置文件
默认格式化容易因编辑器差异或插件版本导致输出不一致，尤其涉及表格时的换行策略（比如是否在每个 <td> 前换行）、引号类型、属性排序。用 Prettier 插件配合配置文件能锁定行为：
<p>在项目根目录建 <code>.prettierrc，写入：
{
"htmlWhitespaceSensitivity": "ignore",
"bracketSameLine": false,
"singleQuote": false,
"tabWidth": 2,
"useTabs": false
}
其中 "htmlWhitespaceSensitivity": "ignore" 是关键——它让 Prettier 忽略 HTML 中原本的空白符，只按语义层级缩进，避免表格单元格内容被意外折行或挤压。
手写表格时缩进混乱？记住唯一规则：子元素比父元素多缩进 2 空格
不用记“<thead> 缩进 2、<code><tr> 缩进 4、<code><th> 缩进 6”这种死规则。只要遵循“每进一层嵌套，就多 2 个空格”，视觉结构和格式化工具预期就完全对齐。例如：
<pre class="brush:php;toolbar:false;"></pre>
<table>
<thead><tr>
<th>姓名</th>
<th>部门</th>
</tr></thead>
<tbody><tr>
<td>张三</td>
<td>前端</td>
</tr></tbody>
</table>
<p>注意：<code><thead> 和 <code><tbody> 同级，缩进相同；<code><tr> 在它们内部，所以多缩进 2；<code><th>/<code><td> 再多 2。这个习惯比依赖格式化工具更底层、更可靠——哪怕某次快捷键失灵，也能一眼看出哪层漏了缩进或闭合。</td>
