为什么我的 HTML 中总是出现杂散标签错误？

Question

我在我的代码上使用 W3C 验证服务报告，并且我不断收到错误消息“Stray end tag ‘head”，但我看不出问题是什么？我的 head 包含一个标题和一个开始和结束标签？是否有可能影响父容器的自关闭子元素？或者我缺少的其他东西？

<!DOCTYPE html>
<html lang="en">
<head class="page-head">
  <meta charset="utf-8">
  <meta name="Tobias' Portfolio" content="This is the portfolio website that Tobias Rasmussen has developed during his first weeks as CareerFoundry.">
  <title>Home</title>
  <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
  <link rel="icon" href="img/favicon.ico" type="image/x-icon">
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"> <!-- This link goes to a CDN (Content dilivery network), downloading a file that resets/normalizes the client's CSS. THIS MUST COME BEFORE THE LINK TO OUR STYLESHEET! -->
  <link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet"> <!-- This tag embeds the roboto condensed font from Google Fonts onto my HTML file. Note: it is important to put BEFORE the link to the styles.css -->
  <link rel="stylesheet" type="text/css" href="css/style.production.css"> <!-- The link to the external stylesheet-->
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!--viewport tag-->
  <div>
    <header class="page-header">
      <img src="img/my_logo.png" alt="Logo with the name Tobias Rasmussen in a black font on a white background" class="page-header__item page-header__logo">
      <nav class="main-navigation page-header__item">
        <ul role="menubar" class="navigation-list">
          <li role="presentation">
            <a href="#home" role="menuitem" class="navigation-list__item navigation-list__item--active">Home</a>
          </li>
          <li role="presentation">
            <a href="about.html" role="menuitem" class="navigation-list__item" target="_blank">About</a>
          </li>
          <li role="presentation">
            <a href="contact.html" role="menuitem" class="navigation-list__item" target="_blank">Contact</a>
          </li>
          <li role="presentation" >
            <a href="work.html" role="menuitem" target="_blank" class="navigation-list__item">My Work</a>
          </li>
        </ul>
      </nav>
    </header>
  </div>
</head>

Answer 1

你的头标签不应该在底部结束，因为它不应该包含标题和其他标签，这些标签应该包含在正文中。

该元素是元数据（关于数据的数据）的容器，位于<html>标签和<body>标签之间。

元数据是关于 HTML 文档的数据。 不显示元数据。

元数据通常定义文档标题、字符集、样式、脚本和其他元信息。

以下元素可以进入元素内部：

<title> (required in every HTML document)
<style>
<base>
<link>
<meta>
<script>
<noscript>

您可以在此处阅读更多相关信息： https : //www.w3schools.com/tags/tag_head.asp

一个基本的 html 示例：

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Title of the document</title>
</head>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

为什么我的 HTML 中总是出现杂散标签错误？

问题描述

1 个解决方案

解决方案1
2 2020-09-08 09:21:17

为什么我的 HTML 中总是出现杂散标签错误？

问题描述

1 个解决方案

解决方案1 2 2020-09-08 09:21:17

解决方案1
2 2020-09-08 09:21:17