# 自闭合HTML标签参考
HTML空元素（自闭合标签）、SVG元素和MathML元素的完整参考指南
> 标准页面: https://elysiatools.com/zh/tools/self-closing-html-tags
- **分类:** Development
- **关键词:** html, 自闭合, 空元素, 标签, svg, mathml, html5, 参考
## 概述
这是一个快速、全面的自闭合HTML标签（空元素）、SVG元素和MathML元素参考工具。它能帮助开发者快速查找、筛选和验证这些特殊标签的正确语法与用法，提升编码效率与准确性。
## 输入项
- **元素类型** (select): Filter elements by type
- **搜索元素** (text): 按名称或描述过滤元素
- **包含代码示例** (checkbox): 包含HTML元素的语法示例（如适用）
- **输出格式** (select): 选择输出格式
## 适用场景
- 在编写HTML代码时，需要快速确认某个标签（如 \`\`、\` \`）是否为自闭合标签及其正确写法。
- 在开发SVG图形或MathML数学公式时，需要查询特定的SVG或MathML元素及其属性。
- 在代码审查或学习过程中，需要验证或了解自闭合标签的完整列表和标准用法。
## 工作原理
- 选择要查询的元素类型，包括所有自闭合元素、仅HTML空元素、仅SVG元素或仅MathML元素。
- 在搜索框中输入元素名称或关键词，工具将实时过滤并显示匹配的结果列表。
- 可选择是否在结果中包含该元素的代码语法示例，以便直接参考或复制。
- 选择输出格式（纯文本、Markdown或JSON），以满足不同场景下的信息展示或集成需求。
## 使用案例
- 前端开发人员在编写HTML页面时，快速查询并插入正确的自闭合图片标签 \`!\[...\](...)\`。
- SVG图形开发者在创建矢量图标时，查找 \`\` 或 \`\` 等SVG元素的正确属性和语法结构。
- 教育工作者或学生在编写包含数学公式的网页时，参考MathML元素（如 \`\`）来正确表示上标。
## 常见问题
### 什么是自闭合HTML标签？
自闭合标签（也称为空元素）是指在HTML中不需要闭合标签的元素，它们通常没有内容，语法为 \`<标签名 />\` 或 \`<标签名>\`，例如 \`\`、\`
\` 和 \`\`。
### 为什么需要这个参考工具？
它提供了一个集中、可搜索的列表，避免了开发者在不同文档间切换查找，能快速确认标签的正确性、支持的属性以及所属类别（HTML/SVG/MathML）。
### 这个工具支持哪些类型的元素？
支持三大类：HTML空元素（如 \`
* * *
\`、\`\`）、SVG元素（如 \`\`、\`\`）和MathML元素（如 \`\`、\`\`）。
### 如何搜索特定的元素？
在“搜索元素”输入框中键入元素名称（如“img”）或描述性关键词（如“换行”），列表将自动筛选并显示相关结果。
### 输出格式有什么区别？
纯文本适合快速阅读；Markdown格式便于粘贴到文档中；JSON格式则方便程序解析或与其他工具集成。
## 相关工具
- [Data URI 生成器](https://elysiatools.com/zh/tools/data-uri-generator): 将文件转换为 Data URI（Base64 或百分号编码），用于直接在 HTML、CSS 或 Markdown 中内联图片、字体等资源
- [SVG Sprite Sheet 生成器](https://elysiatools.com/zh/tools/svg-sprite-generator): 上传最多 30 个 SVG 图标，合并为单个 sprite sheet： 模式用于页面内联 ， 模式用于外部文件片段引用。自动补全 viewBox（由 width/height 推导）、去除重复图标、可选剥离 fill/stroke 以配合 currentColor、始终清理 与 on\* 事件属性，并生成 HTML / React / Vue / CSS 使用代码片段与每个图标的实时预览。
- [HTML标签参考](https://elysiatools.com/zh/tools/html-tags): 完整的HTML5标准标签参考指南，包含分类和描述
- [ASCII 字符表参考](https://elysiatools.com/zh/tools/ascii-table): 浏览完整 ASCII 字符表（0–127），含十进制、十六进制、八进制、二进制、HTML 实体和控制字符名称，支持按码值或名称过滤
- [无障碍合规检测器](https://elysiatools.com/zh/tools/accessibility-checker): 检测 HTML、网页或设计稿图片中的常见 WCAG 2.1 问题，并给出可直接修复的建议
- [PDF页眉页脚片段](https://elysiatools.com/zh/tools/pdf-header-footer-snippets): 将HTML转换为PDF，并插入Logo/标题/日期等页眉页脚片段
- [正则表达式铁路图可视化器](https://elysiatools.com/zh/tools/regex-railroad-diagram-visualizer): 把正则表达式渲染为 SVG 铁路图（语法图），显示字面量、分组、分支与重复，并标注捕获组编号与标志说明
- [JSON 差异可视化](https://elysiatools.com/zh/tools/json-diff-visualizer): 比较两个 JSON 并生成带颜色、路径和统计信息的可视化差异报告
## 示例
- [SVG示例](https://elysiatools.com/zh/samples/svg-samples): 可缩放矢量图形（SVG）示例，展示各种SVG功能和技术
- [D3.js 数据可视化示例](https://elysiatools.com/zh/samples/d3js-data-visualization): 全面的D3.js数据可视化示例，包括图表、地图、动画和交互式可视化
- [SVG 查看器样本](https://elysiatools.com/zh/samples/svg-viewer-samples): 用于浏览器内 SVG 查看器的样本矢量图
- [XML 查看器样本](https://elysiatools.com/zh/samples/xml-viewer-samples): 用于浏览器内 XML 查看器的样本文件