程序员经验分享-hwhale

HTML 验证器“自关闭语法”和“非空”错误

2024-04-22

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

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

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

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

Code:

<!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>

首先，关闭锚点（<a>) 元素在你的<h1>容器。

无效的 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>

确保始终将结束标签添加到非空（非自闭合）元素。检查每个元素的描述 https://developer.mozilla.org/en-US/docs/Web/HTML/Element确定“标签省略”要求。

空元素也称为自动关闭, empty and 单例。这里有一个HTML 中所有 void 元素的列表 http://www.w3.org/TR/html5/syntax.html#void-elements

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

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

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

这是有效的 HTML：

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

事实上，去掉斜杠就是Google HTML/CSS 样式指南推荐 https://google.github.io/styleguide/htmlcssguide.html和堆栈溢出社区 https://stackoverflow.com/questions/3558119/are-self-closing-tags-valid-in-html5.

Also, 将图像放入标题元素内（在本例中<h1>) 完全有效 https://stackoverflow.com/questions/1605454/can-we-place-img-inside-h1-according-to-web-standards。这是否正确是另一个问题。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

html

validation

specifications

w3c

HTML 验证器“自关闭语法”和“非空”错误 的相关文章