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> 内部是否漏了 <tr> 或嵌套错层
常见现象：格式化后表格在浏览器里显示错位、列宽崩坏、rowspan/colspan 失效。根本原因往往不是格式问题，而是 HTML 结构本身不合法：<td> 直接放在 <table> 下（跳过了 <tr>），或 <thead> 里混进了 <tbody> 的 <tr>。格式化工具不会修复逻辑错误，只会让错误更“整齐地错”。务必确认：
-
<table>→ 必须只包含<caption>、<colgroup>、<thead>、<tbody>、<tfoot>、<tr> -
<tr>→ 只能直接放在<thead>/<tbody>/<tfoot>或<table>内，不能套<div>或其他非表格标签 - 每个
<tr>下至少有一个<td>或<th>，且数量一致（否则 colspan 计算会偏移）
想让格式化结果稳定？加个 .prettierrc 配置文件
默认格式化容易因编辑器差异或插件版本导致输出不一致，尤其涉及表格时的换行策略（比如是否在每个 <td> 前换行）、引号类型、属性排序。用 Prettier 插件配合配置文件能锁定行为：
在项目根目录建 .prettierrc，写入：
立即学习“前端免费学习笔记（深入）”；
{
"htmlWhitespaceSensitivity": "ignore",
"bracketSameLine": false,
"singleQuote": false,
"tabWidth": 2,
"useTabs": false
}
其中 "htmlWhitespaceSensitivity": "ignore" 是关键——它让 Prettier 忽略 HTML 中原本的空白符，只按语义层级缩进，避免表格单元格内容被意外折行或挤压。
手写表格时缩进混乱？记住唯一规则：子元素比父元素多缩进 2 空格
不用记“<thead> 缩进 2、<tr> 缩进 4、<th> 缩进 6”这种死规则。只要遵循“每进一层嵌套，就多 2 个空格”，视觉结构和格式化工具预期就完全对齐。例如：
<table>
<thead>
<tr>
<th>姓名</th>
<th>部门</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>前端</td>
</tr>
</tbody>
</table>
注意：<thead> 和 <tbody> 同级，缩进相同；<tr> 在它们内部，所以多缩进 2；<th>/<td> 再多 2。这个习惯比依赖格式化工具更底层、更可靠——哪怕某次快捷键失灵，也能一眼看出哪层漏了缩进或闭合。
