HTML5 验证错误答案

【问题标题】：HTML5 Validation ErrorsHTML5 验证错误
【发布时间】：2012-04-03 10:11:07
【问题描述】：

在尝试将我的页面验证为 HTML5 时，我遇到了一些问题。有两个错误。第一个说，'元素头缺少子元素标题的必需实例'，第二个错误是，'在这种情况下，元素 hr 不允许作为元素 ul 的子级。（抑制来自该子树的更多错误）'。

这是我的源代码

<!DOCTYPE html>

<html lang="en">

<head>

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

<link rel="stylesheet" href="core/css/style.css">

</head>

<body>

<nav>

<h1>Name</h1>

<ul>

<hr>

<li><a href=".."><img src="core/images/home.png" alt="Home"></a></li>

<hr>

<li><a href=".."><img src="core/images/about.png" alt="About"></a></li>

<hr>

<li><a href=".."><img src="core/images/projects.png" alt="Projects"></a></li>

<hr>

</ul>

</nav>

-提前感谢您的帮助

【问题讨论】：

错误消息对我来说似乎很不言自明。您的头部缺少<title>，并且您不能在<ul> 标记中包含<hr>s。
谢谢，那我可以用什么来代替
你为什么还要使用列表？只需使用 div 代替。或者设置列表元素的样式，使其具有顶部或底部边框。
真的，谢谢你的帮助:)
@Juhana 因为它是一个导航菜单我会说列表标签是正确的标记。 OP 应该应用 CSS 来获得所需的外观。

标签： html validation

【解决方案1】：

正如 Juhana 的评论所指出的，错误是不言自明的：

元素头缺少子元素标题的必需实例

这意味着您只是在<head> 标记中缺少<title> 标记。你绝对应该给你的页面一个标题！

在此上下文中元素 hr 不允许作为元素 ul 的子元素

本质上，<ul>（无序列表）标签只能包含<li>（列表项）标签。在列表中使用水平规则是错误的。您可以使用 CSS 实现相同的效果。我建议阅读更多关于 HTML 和基本 CSS 的教程。

【讨论】：

谢谢你:)！我现在已经修复了它，只是在我的

【解决方案2】：

<ul> 中的 <hr> 标签也有同样的问题。您只需在<li> 中包含<hr>，而不是对您的列表应用新的css 规则。

<ul>
  <li><hr/></li>
  <li>text</li>
</ul>

然后，<ul> 中的所有元素都被正确嵌套和包含。不需要额外的工作。

【讨论】：