ToolDeck 的免费在线 HTML 工具让您可以直接在浏览器中格式化、压缩、转义和转换 HTML，无需安装，无需注册。使用 HTML Formatter 将混乱的标记代码美化输出，支持自定义缩进。通过 HTML Minifier 压缩生产文件，在不影响功能的前提下减少传输体积。使用 HTML Escape / Unescape 安全编码特殊字符，防止模板中的 XSS 漏洞。通过 HTML to JSX 转换器将标记迁移到 React，或通过 HTML to Markdown 转换器将网页内容提取为文档。无论您是在调试生产页面、准备 React 迁移，还是从 CMS 中提取内容，这些 HTML 工具都能通过一个可收藏的 URL 完成任务——五个工具全部在客户端运行，您粘贴的内容不会上传到任何服务器。
什么是 HTML 工具？
HTML（超文本标记语言）是 Web 的标准文档格式，由 WHATWG HTML 生态标准定义，由 W3C 维护。每个浏览器解析 HTML 以构建 DOM（文档对象模型），DOM 控制用户看到的内容和交互方式。处理原始 HTML 是前端和全栈开发者的日常工作，无论是编写模板、调试渲染输出，还是为生产部署准备标记代码。
HTML 工具将这些重复性工作自动化。格式化可添加一致的缩进，帮助您阅读深层嵌套结构。压缩可去除空白符、注释和可选的关闭标签，以减少传输体积。实体转义将 <、> 和 & 等字符转换为安全引用，使其以文本形式呈现，而不是被解析为标记。转换工具可将 HTML 转换为 JSX 或 Markdown，省去每次迁移时手动重命名属性和重新格式化的工作。
当您在调试渲染错误的页面、审查包含大量模板变更的 Pull Request、准备 HTML 邮件布局、将代码库从原生 HTML 迁移到 React，或将 CMS 内容提取到文档系统时，这些工具都能派上用场。基于浏览器的工具无需安装任何依赖或配置构建流程，也非常适合一次性任务——在本地配置工具链花费的时间可能比任务本身还长。
为什么在 ToolDeck 上使用 HTML 工具？
ToolDeck 在您的浏览器中处理所有内容。您的 HTML 不会离开您的设备，这对于处理包含 API 密钥（在 meta 标签中）、内部 URL 或未发布页面结构的标记代码尤为重要。页面加载后，每个工具均可离线使用——粘贴标记代码后立即显示结果，无需任何服务器请求。没有账户、没有速率限制、没有使用上限。
🔒默认私密
所有处理均在浏览器标签页中完成。HTML 不会上传到任何服务器，因此您可以安全地粘贴内部模板和生产标记代码。
⚡即时结果
格式化、压缩和实体转换在您输入时即时完成，无需等待服务器往返或构建过程。
🧩五个工具，一体化工作流
在同一个地方完成格式化、压缩、转义、转换为 JSX 和转换为 Markdown，无需在不同网站或命令行工具之间切换。
🌐无需配置
打开页面，粘贴您的 HTML。适用于任何操作系统和浏览器，无需 npm 包、编辑器扩展或配置文件。
HTML 工具使用场景
HTML 处理贯穿项目的每个阶段。以下六个场景涵盖了最常见的任务：格式化不可读的标记代码以供审查、压缩生产资源、保护模板免受注入攻击、转换为 React、提取内容用于文档，以及在发送前审查邮件布局。
前端调试
将生产页面中的压缩 HTML 粘贴到
HTML Formatter 中以还原缩进，追踪导致布局问题的元素嵌套路径。当您需要一次性查看完整文档结构时，这比使用浏览器 DevTools 更快。
React 迁移
使用 HTML to JSX 转换器将现有 HTML 模板转换为 JSX。它会自动处理 class 到 className、for 到 htmlFor 以及内联样式对象的转换。
文档提取
使用 HTML to Markdown 转换器将 HTML 页面转换为 Markdown，用于 README 文件、Wiki 或静态站点生成器。支持标题、粗体、斜体、链接、图片、列表、表格和代码块。
邮件模板质量检查
格式化 HTML 邮件模板以审查嵌套表格布局，然后将其压缩用于发送。邮件客户端对标记代码要求严格，因此可读的源代码有助于及早发现错误。
HTML 实体参考
HTML 定义了超过 2000 个命名字符引用。下表列出了在转义和反转义标记时最常用的实体。五个必须转义的字符（&、<、>、"、'）必须在 HTML 属性和文本内容中进行编码，以防止解析错误和 XSS 漏洞。
| 命名实体 | 字符 | 数字编码 | 何时转义 |
|---|
| & | & | & | 始终 — 在所有 HTML 上下文中被解析为实体起始符 |
| < | < | < | 始终 — 被解析为标签开始符；在文本和属性中必须转义 |
| > | > | > | 推荐 — 在某些上下文中被解析为标签结束符 |
| " | " | " | 在双引号属性内（例如 title="..."） |
| ' | ' | ' | 在单引号属性内（例如 title='...'） |
| | |   | 不换行空格 — 用于文本中的固定宽度间距 |
| © | © | © | 版权符号 — 常见于页脚标记 |
| — | — | — | 全角破折号 — 用于替换双连字符的排版符号 |
| … | … | … | 水平省略号 — 在 UI 文本中替换三个点 |
| ™ | ™ | ™ | 商标符号 — 法律和产品页面 |
完整列表请参阅：WHATWG HTML 生态标准，第 13.5 节 — 命名字符引用。
如何选择合适的 HTML 工具
每个工具针对 HTML 工作流中的特定步骤。从您需要完成的任务开始。如果您的任务跨越多个步骤，这些工具可以顺序配合使用——先格式化以检查结构，然后根据需要进行转换或压缩。
- 1
如果您需要 阅读或调试缩进混乱的 HTML，或统一团队的格式规范 → HTML Formatter - 2
如果您需要 通过删除空白符和注释来减小 HTML 文件的生产体积 → HTML Minifier - 3
如果您需要 编码特殊字符以安全渲染，或将实体解码为可读文本 → HTML Escape / Unescape - 4
如果您需要 将 HTML 模板转换为具有正确 JSX 语法的 React 组件 → HTML to JSX Converter - 5
如果您需要 将 HTML 页面中的内容提取为 Markdown，用于文档或静态站点 → HTML to Markdown Converter
这些工具可以顺序配合使用。您可能先格式化传入的 HTML 以检查其结构，将其转换为 JSX 用于 React 项目，然后将最终渲染输出压缩用于生产。如果您正在迁移整个站点，HTML to JSX 和 HTML to Markdown 转换器能节省最多的手动编辑时间。对于日常工作，HTML Formatter 和 HTML Escape / Unescape 是您最常用到的工具。
常见问题
HTML 压缩和压缩算法（gzip/Brotli）有什么区别？
压缩（Minification）是从 HTML 源代码中删除不必要的字符：空白符、注释、可选的关闭标签和冗余属性。输出结果是体积更小的有效 HTML。压缩算法（gzip、Brotli）是在服务器或 CDN 层面单独进行的步骤，使用无损算法对已压缩的文件进行编码。为获得最佳效果，请先进行 Minification，再启用传输压缩。
为什么需要转义 HTML 实体？
< 、>、& 和 " 等字符在 HTML 中具有特殊含义。如果用户提供的文本包含这些字符，而您在未转义的情况下将其插入页面，浏览器会将其解析为标记代码。这轻则导致渲染错误，重则引发跨站脚本（XSS）漏洞。转义将这些字符替换为命名或数字引用（<、>、&、"），使浏览器将其显示为文字文本。服务端模板引擎通常会自动处理此问题，但在构建原始 HTML 或使用 innerHTML 时，您仍需验证输出结果。
HTML 到 JSX 的转换是如何工作的？
JSX 是 React 使用的 JavaScript 语法扩展，外观类似 HTML，但遵循 JavaScript 规则。转换过程将 HTML 属性更改为对应的 JSX 写法：class 变为 className，for 变为 htmlFor，tabindex 变为 tabIndex，等等。内联 style 属性从 CSS 字符串转换为 JavaScript 对象：属性名变为驼峰命名（font-size 变为 fontSize，background-color 变为 backgroundColor），值变为对象字面量中的带引号字符串。img 和 br 等自闭合标签添加显式斜杠，disabled 等布尔属性保持不变，因为 JSX 处理它们的方式与 HTML 布尔属性相同。
将生产 HTML 粘贴到基于浏览器的工具中安全吗？
在 ToolDeck 上是安全的。所有 HTML 处理完全在您的浏览器标签页中通过 JavaScript 运行，没有数据发送到任何服务器，关闭标签页后也不会存储任何内容。您可以在使用任何工具时打开浏览器的网络检查器来验证这一点。对于高度敏感的标记代码，您也可以在粘贴前断开网络连接——页面加载后，这些工具不需要任何网络连接。
格式化工具支持哪些 HTML 特性？
HTML Formatter 可解析完整的 HTML5 语法：嵌套元素、自闭合标签（空元素）、使用单引号和双引号的属性、无引号属性、内联脚本和样式、HTML 注释、DOCTYPE 声明和 CDATA 节。它根据嵌套深度应用一致的缩进，同时保留 pre 和 textarea 元素中空白符有意义的内容。可配置选项包括缩进大小（空格或 Tab）以及是否将属性换行显示。
我可以将 Markdown 转换回 HTML 吗？
HTML to Markdown 工具是单向的：它将 HTML 转换为 Markdown。Markdown 转 HTML 是一个不同的过程，需要 Markdown 解析器。大多数静态站点生成器（Hugo、Jekyll、Astro）和库（marked、markdown-it、Python-Markdown）都支持这个方向。ToolDeck 的转换器专为反向场景设计：将现有网页中的内容提取为 Markdown，用于文档、README 文件或 CMS 迁移。
命名实体和数字 HTML 实体有什么区别？
命名实体使用助记标签：& 表示 &，© 表示版权符号，— 表示全角破折号。数字实体使用十进制（&）或十六进制（&）形式的 Unicode 码位。两者渲染出相同的字符。命名实体在源代码中更易读，但 HTML 规范中仅定义了约 250 个命名实体——数字实体可以表示任何 Unicode 字符，包括 emoji 和非拉丁文字。对于五个必须转义的字符（&、<、>、"、'），两种形式均可使用。