本文详解如何使用 HTML Tidy 工具（命令行）实现符合现代开发习惯的 HTML 格式化，重点解决 <link>/<script> 等标签中 href、integrity、crossorigin 等多属性的垂直对齐与智能缩进问题。
本文详解如何使用 html tidy 工具（命令行）实现符合现代开发习惯的 html 格式化，重点解决 ``/`<script>` 等标签中 `href`、`integrity`、`crossorigin` 等多属性的垂直对齐与智能缩进问题。</script>
HTML Tidy 是历史悠久且高度可配置的 HTML 清理与格式化工具，但其默认行为往往无法满足现代前端项目对代码可读性与一致性的严苛要求——尤其是当 <link> 和 <script> 标签包含多个长属性（如 integrity、crossorigin、href）时，简单缩进（-i）常导致属性挤在单行，严重降低可维护性。
幸运的是，Tidy 5.6.0+ 提供了关键配置项 --indent-attributes yes，它能强制将同一标签内的多个属性逐行列出，并自动对齐到相同缩进层级。配合合理的行宽限制（-w）和标准缩进开关（-i），即可生成结构清晰、属性对齐的专业级 HTML：
# 推荐命令：启用属性换行 + 指定行宽（140字符）+ 静默+缩进+输出为HTML tidy -qni -ashtml --indent-attributes yes -w 140 input.html -o formatted.html
✅ 效果说明：
- 所有属性（href, rel, integrity, crossorigin 等）自动换行并左对齐；
- 嵌套元素（如 .container > .row > .col）保持语义化缩进层级；
- <script type="module"> 内联 JavaScript 不被破坏，内容原样保留（Tidy 默认不格式化 <script> 内部文本，符合预期）；
- --indent-attributes yes 是核心开关，缺省时 Tidy 仅缩进标签层级，不处理属性布局。
⚠️ 注意事项：
立即学习“前端免费学习笔记（深入）”；
- --indent-attributes 在旧版 Tidy（<5.4）中不可用，请通过 tidy -v 确认版本；
- -w 140 建议设为 120–160 之间：过窄会导致过度折行（如 integrity 哈希值被截断），过宽则失去对齐意义；
- 若需保留原始 <meta name="generator">，可添加 --hide-comments no --drop-empty-elements no 等防护选项；
- Vim / Neovim 用户可绑定快捷键：:!tidy -qni -ashtml --indent-attributes yes -w 140 % 实现当前文件一键格式化。
最终，你将获得既符合 W3C 规范、又具备工程可读性的 HTML —— 属性对齐一目了然，嵌套结构层次分明，无需依赖在线服务或 GUI 工具，在 CI/CD 或本地开发中均可稳定复现。
