把压缩或凌乱的 HTML 整理成带缩进的清爽结构,浏览器本地运行
- 本地处理
- 分类 开发运维
- 适合 格式化、校验、压缩或检查和代码相关的文本。
格式化结果显示在这里。这个工具能做什么
免费在线 HTML 格式化与美化工具,把压缩成一行的脏代码整理成带缩进、 好读的结构。粘贴压缩后的 HTML,工具会沿着标签层级走一遍,让每个元素 单独成行,按嵌套深度缩进,缩进宽度可选 2 空格、4 空格或 Tab 三档。 像 br、img、input、meta 这类自闭合空元素不会多出一层闭合缩进,而 span、a、b、i 等行内元素可以选择留在同一行,这样一句话不会被拆成 一个词一行。pre、textarea、script、style 里的内容原样保留,对空白 敏感的代码和预排版文本一字不动地保住。它故意做得很宽容,不强校验 合法性,所以残缺片段和稍微写坏的标签也能整理出来。全部在浏览器里 运行,一键复制,带结果的链接随手可分享。100% 浏览器本地,什么都不上传。
工具细节
- 输入
- 文本 + 结构化内容
- 页面会根据工具类型展示文本框、数值控件、文件选择或结构化输入。
- 输出
- 即时结果 + 复制 + 下载
- 结果区优先给出可操作结果，支持项会显示复制、下载或可视化预览。
- 隐私
- 浏览器本地处理
- 主工具逻辑未发现外部 API 调用，输入通常留在当前标签页内处理。
- 保存 / 分享
- 可分享链接状态
- 关键设置会进入 URL，复制链接后别人能复现同一组参数。
- 性能预算
- 首屏 JS ≤ 9 KB
- 没有声明 WASM 依赖，适合快速打开和移动端使用。
- 适用场景
- 开发运维 · 程序员
- 分类和职业标签用于推荐相关工具、组织内链，并帮助用户快速判断是否适合当前任务。
怎么用
-
1. 输入
把内容粘贴或拖入工具面板。
-
2. 处理
点击按钮,在浏览器内本地处理,文件不上传。
-
3. 复制 / 下载
一键复制结果或下载到本地。
HTML 格式化工具 适合怎么用
适合穿插在写代码、查问题、做 Review、上线前的小任务里。
适合开发场景
- 格式化、校验、压缩或检查和代码相关的文本。
- 把片段整理好再放进文档、工单、提交或交接材料。
- 不切换工具,快速检查一个小 payload。
开发检查项
- 压缩、混淆这类不可逆处理,先对副本操作。
- 除非确认工具本地处理,不要粘贴密钥和敏感片段。
- 转换后的代码上线前,仍要跑自己的测试或 lint。
下一步可以接着做
这些入口会把当前任务接到更完整的工具链里。
真实使用场景
读从查看源码里扒下来的压缩 HTML
你对着线上页面查看源代码,整个 body 挤成不可读的一行。复制粘到 这里,格式化器把它展开成带缩进的树,你就能找到那个带特定 class 的 div。不用构建工具,不用编辑器插件,也不用先存成本地文件才能 看清别人页面的结构。
整理 CMS 或邮件工具吐出来的 HTML
所见即所得编辑器和邮件搭建器导出的 HTML,常常是一大坨嵌套表格加 内联样式,完全没有格式。粘进去美化一下,表格结构立刻看得清,落单 的闭合标签也能一眼揪出,手改标签不用再跟文本框里那一行死磕。
提交前让 diff 变得可读
同事把模板当成压缩的一行提交了,现在每次改动都显示成巨大的单行 diff。把两个版本都格式化成统一的 2 空格缩进,再丢进 diff 工具, 真正改了什么就一行行显出来,不会再藏在一串读不了的字符里。
贴进文档或教程前把片段整理干净
你在写博客或 README,想让示例 HTML 看着专业。用代码块习惯的缩进 宽度跑一遍格式化,行内标签留在同一行让正文示例读起来自然,贴出 一份干净统一的标签,读者复制走不用再重新排版。
常见踩坑
指望格式化器修好坏掉的 HTML。它只整理空白和缩进,不会补未闭合的标签或修正错误嵌套。`<div><p></div>` 这种不匹配进去,出来还是缩进过的不匹配。要正确性用校验器,要可读性用这个。
关掉行内同行开关,然后纳闷文字怎么多出了缝。行内元素之间的空白是有意义的,把 `<a>one</a> <a>two</a>` 拆成两行可能加出或挪动一个渲染空格。标签是正文时,让行内元素留在同一行。
以为 pre 或 script 里的内容会跟着重新缩进。它不会,这是故意的。这些区域原样保留,所以 script 标签里的代码相对页面看着没缩进,那是正确行为,不是 bug。
隐私说明
整个格式化器都是浏览器标签页里运行的纯 JavaScript。你的 HTML 在本地 被切分和重新缩进,从不发往任何服务器,不记录,也不保存。唯一要注意: 分享链接会把你的输入写进查询字符串,所以把分享链接粘到聊天里,对方 服务器的访问日志会留下那段标签。涉及保密的页面源码或未发布的模板, 请用复制按钮粘贴文本,而不是分享网址。
常见问题
类似工具组合
做你这行的人, 还会一起用这些。