img 标签到底需要关闭吗？

[iceice121]

偶然看到这个 Tag omission Must have a start tag and must not have an end tag.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#technical_summary

同类的还有 input

F12 查看渲染出来的 img 也是没有关闭的，所以我就去看了看几个常用的 UI 框架文档

https://ant.design/components/card-cn/ （关闭）

https://element-plus.org/zh-CN/component/card.html#%E6%9C%89%E5%9B%BE%E7%89%87%E5%86%85%E5%AE%B9%E7%9A%84%E5%8D%A1%E7%89%87 （关闭）

https://quasar.dev/vue-components/avatar （未关闭）

https://mui.com/zh/material-ui/react-image-list/ （关闭）

那么问题来了，既然都能正常渲染，到底谁才是对的？

[wunonglin]

不需要

[kyuuseiryuu]

应该

[estk]

vscode ，img 标签没有 alt 属性都给我 warning

[marcong95]

img 、input 这类的叫 Void Elements ，对于 HTML 不应闭合，但是 XHTML 、JSX 里必须闭合（所以你看的 UI 框架闭合的应该都是 React 的），Vue 的 Style Guide 没有特别强调，但是看 Style Guide 提及 <img> 的地方似乎都没有闭合

https://html.spec.whatwg.org/multipage/syntax.html#void-elements

Void elements only have a start tag; end tags must not be specified for void elements.

[westoy]

这涉及到当年 xhtml 快一捅天下的时候突然就被 html5.0 爆了菊花的公案了

此时有请 chinaxhtml 站长 @laogui

[zsxeee]

是 must not have "an end tag"，指的是</img>这种。你说的是闭合标记，这个在 html 中是可选的。

[dcsuibian]

赞同#6 。

单标签都建议写成<br/>而不是<br>，养成习惯。
HTML 处理比较宽松，但不报错并不是说你就应该这么写。隔壁严谨的 XML 要气疯了，这样以后用上 JSX （ JavaScript XML ）的时候也比较舒服。

而且，配合 IDE ，按 shift+. 你才能打出>，而按 /不是更方便么。

[dcsuibian]

顺便说一下，<script src="main.js"></script>这种标签，就算标签体里没有任何内容的，也绝不要写成单标签，会出错的。（原生 HTML 来说）
只有<img/>、<br/>这种标签体里永远没有内容的才写。

[thunderw]

HTML4 年代大家都是不关闭的。
关闭 img 应该是 XHTML 时代提出来的，参见 https://www.w3.org/TR/xhtml2/mod-image.html
<img alt="W3C Logo" src="W3C.png">W3C</img>

到 HTML5 了就又不提倡关闭了 <img> <img /> 都无所谓了