HTML格式化

HTML 格式化解决的是可读性问题：从接口拿回的页面片段、经过压缩的模板、或者从浏览器「查看源代码」里复制出来的内容，经常挤成一整行，或者缩进被空格和 Tab 混着搞乱。这个工具把这样的 HTML 重新排版——按标签的开合关系重建嵌套结构，再逐行换行、按层级深度加上统一宽度的缩进，让某个 div 到底包了哪些子节点、几个 li 是不是同级，一眼就能看出来。它只调整换行和缩进，不改动标签名、属性和文本，所以格式化前后浏览器渲染出来的页面完全一致。整个解析和美化过程都在你自己的浏览器本地完成，代码不上传服务器。

它的核心是一遍轻量的标签扫描：从头读源码，遇到开标签就把当前缩进深度加一再换行输出，遇到闭标签就先减一再输出，从而让配对的 div 和 /div 落在同一列上。关键在于对自闭合的 void 元素做特判——br、img、input、hr、meta、link 这些标签在 HTML 里本来就没有闭合形式，工具会把它们当成单行输出，既不增加后续缩进深度，也不会替你硬补一个 /br。script、style 以及注释里的内容通常按原样保留，避免把 JavaScript 里的大于号、小于号误判成标签而打乱层级。这也是它和真正的 DOM 解析器不同的地方：它做的是文本层面的缩进重排，追求的是把 html 排版整理得清晰，而不是构建一棵完整的语法树。

最常见的用法是调试时的临时整理。比如后端接口直接吐回一段 HTML 邮件模板，几千个字符全挤在一行，粘进来做一次 html 缩进，就能顺着层级找到某个 td 的样式写在哪、哪一层 table 嵌套多了。又比如从别人网站复制一段结构想参考它的布局，原始代码被构建工具压缩得没有一个换行，html 美化之后配合编辑器的代码折叠，能快速看清整体骨架再决定摘哪一块。写爬虫、对着页面结构定位 CSS 选择器时，先把目标片段格式化 html 排版一遍，也比盯着压缩代码逐个数标签省力得多。

需要留意的是，格式化只负责排版，不做语法校验也不修复错误：如果源码里少了一个闭合标签、或者标签交叉嵌套，缩进可能会从出错处开始整体偏移——这反倒能当成排查手段，缩进突然错位的位置往往就是标签没配对的地方。它和 HTML 压缩（minify）是方向相反的操作，也不同于 HTML 转义、Base64 编码那类改变内容本身的工具，这里只增删空白字符、不动一个可见字符。对个别写法很不规范的老页面，排版层级可能和你预期略有出入，把它当作提升可读性的辅助、而不是权威的语法判定即可。

HTML格式化是一个免费的在线工具，打开网页就能用，不用下载也不用注册。平时大家搜的“html格式化”、“html美化”、“html排版”，说的都是这个。