HTML5中自闭合标签即空元素，包括、、、、、、、、、、等，不可嵌套内容且无需也不应写/。
HTML5 中自闭合标签不需要写 /，写了也不报错，但属于冗余写法，且在某些场景下可能引发意外行为。
哪些标签在 HTML5 中是自闭合的
HTML5 明确将部分元素定义为“空元素（void elements）”，它们不能有结束标签，也不能嵌套内容。浏览器解析时会自动忽略任何试图写的 / 或结束标签。
常见空元素包括：<img alt="自闭合标签要写/吗_HTML5自闭合规范【指南】" >、<input>、<br>、<hr>、<meta>、<link>、<area>、<embed></embed>、<source></source>、<track></track>、<wbr></wbr> 等。
这些标签写成 <img src="a.jpg" alt="自闭合标签要写/吗_HTML5自闭合规范【指南】" > 是标准且推荐的；写成 <img src="a.jpg" alt="自闭合标签要写/吗_HTML5自闭合规范【指南】" > 虽被容忍，但不是 HTML5 规范要求，也无实际作用。
立即学习“前端免费学习笔记（深入）”；
<input> 写成 <input> 会出什么问题
表面上看，<input type="text"> 在浏览器里能渲染，但这是解析器“容错修复”的结果，不是规范行为。真实风险藏在细节里：
- 某些服务端模板引擎（如旧版 Django 模板、Jinja2 的 strict mode）会把
/>当作属性值的一部分，导致生成错误的 HTML - XML 解析器或 XHTML 工具链（比如某些构建时的 HTML lint 工具）可能报错或截断内容
- 在内联 SVG 中混用 HTML5 和 XML 风格时，
<input>可能被误判为 XML 元素而破坏上下文
为什么 <div> 不能自闭合
<p><code><div> 不是空元素，它必须有明确的开始和结束标签。写成 <code><div></div> 是无效 HTML，在所有浏览器中都会被解析为 <div></div> —— 但更糟的是，后续内容可能被意外包裹进去。
例如：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
<div class="container" /> <p>Hello</p>
浏览器实际解析为：
<div class="container"> <p>Hello</p> </div>
这不是你想要的。这种隐式闭合行为容易掩盖结构错误，尤其在动态插入 HTML 或服务端渲染时更难调试。
XML 和 XHTML 场景下怎么处理
如果你明确在用 XHTML（即 Content-Type: application/xhtml+xml），那必须严格遵循 XML 规则：所有空元素都得写 /，比如 <img src="x.png" alt="自闭合标签要写/吗_HTML5自闭合规范【指南】" >。但注意：
- 现代 Web 几乎不发 XHTML MIME 类型，绝大多数所谓“XHTML”只是 HTML5 文档加了
.xhtml后缀 - 一旦服务器返回
text/html，哪怕文档声明，浏览器仍按 HTML5 规则解析 - 真正按 XML 解析时，
<br>这种不带/的写法会直接导致解析失败、页面空白
所以判断依据永远是响应头的 Content-Type，而不是文件后缀或 doctype 声明。
最稳妥的做法：只在确定是 XML 环境时才写 /；其余一律用 HTML5 原生写法 —— 空元素不带 /，非空元素必须有结束标签。别依赖浏览器的容错，它掩盖的问题往往比解决的多。
