Question

以下代码在语义上是否正确？我认为我最大的困惑是文章

中各节的需要

文章：HTML元素表示文档，页面，应用程序或网站中的独立组合，旨在可独立分发或重复使用，例如，在联合发布中

部分：HTML部分元素（）表示文档的通用部分，即内容的主题分组，通常带有标题。

在我的情况下我认为文章部分是自包含的信息块，该部分是关于该标题的通用信息。这有意义吗？

<!DOCTYPE html>
 <html>
 <head>
  <Title>Anthonys Personal Profile</Title>
  <link rel="stylesheet" href="css/styles.css">   
 </head>
 <body>
  <article>
   <header>Personal Profil</header>
   <section>
    <p>Role</p>
    <p>Education</p>
    <p>Major</p>
    <p>Residence</p>
  </section>
</article>
<article>
  <header>Key Skills</header>
  <section>
    <p>Development</p>
    <p>PM</p>
    <p>Performance</p>
    <p>Agile</p>
  </section>
</article>

Answer 1

CORRECTION：

我的立场得到了纠正。我在下面链接的规范不包含示例，但是有一个示例包含here：

<article>
 <header>
  <h1>Apples</h1>
  <p>Tasty, delicious fruit!</p>
 </header>
 <p>The apple is the pomaceous fruit of the apple tree.</p>
 <section>
  <h1>Red Delicious</h1>
  <p>These bright red apples are the most common found in many
  supermarkets.</p>
 </section>
...
</article>

清楚地表明我原来的解释是不正确的。 HT @cilerler。

总结一下，section可用于细分，例如h1后的部分，包括h1。

虽然根据article有灵活性。一篇不错的文章，其中包含了做与不做的事。

以下是今天早上对我有意义的事情：

ORIGINAL：

您还需要关闭<section>标签，即：

<section>
.....
</section>

在SO上有一些关于此的问题：

这个问题非常接近你 How to correctly use "section" tag in HTML5?

这个解释了应该使用标签的场景 In what scenarios do you use <section> tag of html 5, in place of <div>?

从那里引用：

部分的示例可以是章节，选项卡式对话框中的各种选项卡式页面，或论文的编号部分。网站的主页可以分为几个部分，用于介绍，新闻和联系信息

section元素表示通用文档或应用程序节... section元素不是通用容器元素。当一个元素用于样式目的或作为脚本编写的便利时，鼓励作者使用div元素。

所以我的理解是section标记了高级部分，而例如报价中提到的各个新闻项目可以标记为articles。

编辑：好的官方规格：

http://dev.w3.org/html5/html-author/#the-section-element

section元素表示通用文档或应用程序部分。在此上下文中，一个部分是内容的主题分组，通常带有标题和可能的页脚。

http://dev.w3.org/html5/html-author/#the-article-element

article元素表示文档，页面或站点的独立部分。这可以是论坛帖子，杂志或报纸文章，博客条目，用户提交的评论或任何其他独立的内容项目。

虽然这至少对我来说还不是很清楚，但我会说，section的意图高于article。我的这一陈述也部分取决于官方规范的结构如何section直接坐在正文下，后来才article：

4.3.4 Sections

    4.3.4.1 The body element
    4.3.4.2 The section element
    4.3.4.3 The nav element
    4.3.4.4 The article element
    4.3.4.5 The aside element
    4.3.4.6 The h1, h2, h3, h4, h5, and h6 elements
    4.3.4.7 The header element
    4.3.4.8 The footer element
    4.3.4.9 The address element
    4.3.4.10 Headings and Sections

Answer 2

以下3篇文章概述了HTML5语义块的使用：

语义正确的HTML

2 个答案: