HTML 验证器“自关闭语法”和“非无效”错误答案

【问题标题】：HTML Validator "self-closing syntax" and "non-void" errorsHTML 验证器“自关闭语法”和“非无效”错误
【发布时间】：2015-10-16 03:12:12
【问题描述】：

我在使用 W3 Validator 验证我的代码时遇到问题。我是网页设计的新手。有人能帮我吗。验证器声明：

错误：非空 HTML 元素上使用了自闭合语法 (/>)。忽略斜线并将其视为开始标记。

从第 15 行第 1 列开始；到第 15 行，第 41 列

p>↩↩↩<h1>↩<a href="http://www.monroecollege.edu:"/><img s

代码：

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Home-International Student Home Page</title>
<link href="cssstyle.css" rel="stylesheet">
</head>
<body>

<h3>About Image:</h3>
<p>Monroe College Logo</p>

<h1>
   <a href="http://www.monroecollege.edu:">
   <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
</h1>

【问题讨论】：

标签： html validation specifications w3c

【解决方案1】：

首先，关闭 <h1> 容器中的锚 (<a>) 元素。

无效的 HTML

<h1>
    <a href="http://www.monroecollege.edu:">
    <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
    <!-- missing closing </a> tag here -->
</h1>

有效的 HTML

<h1>
    <a href="http://www.monroecollege.edu:">
    <img src="monroelogo.jpg"  alt="" height="115" width="700"/>
    </a>
</h1>

确保始终将结束标记添加到非无效（非自闭）元素。检查description for each element 以确定“标签遗漏”要求。

Void 元素也被称为self-closure、empty和singleton。这是list of all void elements in HTML

area, base, br, col, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

所有其他元素都需要结束标记。

此外，对于 void 元素，尾部斜线不再是必需的。这是可以接受的，但不是必需的。

这是有效的 HTML：

<br>, <hr>, <img>, <input>, <meta>, etc.

另外，putting an image inside a heading element (in this case <h1>) is perfectly valid。这样做是否正确是另一个问题。

【讨论】：

【解决方案2】：

别忘了关闭<a>标签

另外，您不需要在图像周围加上 <h1>，它不会做任何事情，并且可能会产生错误，因为它需要一些文本。

【讨论】：

【解决方案3】：

1) HTML 中的图像不需要标题（<h1>、<h2>、<h3> 和 ...）标记。
但这是允许的。不要忘记在 img 上设置 alt 属性！
alt 属性是必需的。

2) html 中的大多数标签在打开后都应该关闭，但不是全部。例如：

<br> <embed> <hr> <img> <input> <link> <meta> <param> <source>

您忘记在最后一行关闭<a> 标记。

【讨论】：