素材阁

HTML 压缩美化

一键 压缩(minify) 或 美化(beautify) HTML 代码:压缩可去掉注释、多余空白与行间换行,美化则按嵌套层级自动缩进。script / style / pre / textarea 的内容会原样保留,不会被破坏。全部在浏览器本地处理。

使用说明

一键压缩或美化 HTML 代码:压缩会去掉注释、合并多余空白与换行,美化则按标签嵌套层级自动缩进。script、style、pre、textarea 里的内容会原样保留,不会被压缩破坏。全部在浏览器本地处理。

  1. 把 HTML 源码粘贴到左侧「输入 HTML」框,点「填入示例」可先看效果。
  2. 点「压缩」生成紧凑代码,按需勾选是否移除注释、是否去掉标签间空白;点「美化」则按缩进设置重新排版。
  3. 下方会显示处理前后的字符数变化,便于对比体积。
  4. 点「复制结果」拿走成品;也可点「结果回填输入」把结果放回输入框,便于压缩与美化来回切换。

常见问题

压缩会不会破坏页面里的 JavaScript?
不会。工具会把 script、style、pre、textarea 整段单独保护起来,只对标签与标签之间的空白做处理,脚本和样式内容保持原样。
压缩后代码还能正常运行吗?
能。移除的只是注释和标签之间的多余空白,不影响 DOM 结构。唯一需要注意的是:若某处依赖标签间的空格来分隔行内文字(如「<b>粗</b> 体」),勾选「去掉标签间空白」会合并掉该空格,可取消该选项避免。
美化后的缩进会改变渲染吗?
正常不会,标签之间的换行与缩进在 HTML 中通常被折叠为单个空白。但同样要注意行内元素之间的空格问题,必要时保留原格式即可。

延伸阅读

相关工具