HTML5部分标签的含义? [英] HTML5 section tag meanings?

查看:116
本文介绍了HTML5部分标签的含义?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



这就是我们所知道的关于这个话题的大量问题,但我无法找到权威的答案来源。 官方定义维基页面,那里有更多文档,但如果不是以非常简单的示例或以不同方式解释正确的用法,那么它们不会解释正确的用法。



到目前为止我已经了解了:

< < / code>定义页面的一部分(部分),例如blogrolls,标题新闻,博客条目列表,评论列表以及可以包含共同主题的所有内容。



< article> 定义了与页面其余部分有意义分离的内容(?)并有一个主题(博客文章,评论,文章等)。



,在<< ; article> ,我们可以使用< section> 来分割它的一部分,在这种情况下,它具有容器的功能来标记




怀疑



如果这些句子正确(或部分正确),这意味着< section> 有两个完全不同的使用情况。



我们可以用这种方式写一个页面:

 <!DOCTYPE html> 
< html lang = zh>
< head>
< meta charset = utf-8>
< title>水果< / title>
< / head>

< body>

< h1>水果大战博客< / h1>

< section id =headlineNews> <! - 用作容器 - >

< h1>水果的新变化是什么?< / h1>
< article>< h1>苹果是最好的< / h1>苹果比香蕉< / article>
<物品>< h1>苹果蛋糕< / h1>使用苹果,您可以准备蛋糕< / article>

< / section>

< section id =blogEntries> <! - 用作容器 - >

< h1>有关水果的文章< / h1>

< article>
< h1>苹果与香蕉< / h1>
<节> <! - 用作章节 - >
< h2>简介:< / h2>
香蕉一直引领世界,但...
< / section>
<节> <! - 用作章节 - >
< h2>问题:< / h2>
谁是最好的?我们不太了解苹果...
< / section>
< / article>

< / section>

< / body>
< / html>

这就是看起来如何的大纲:

  1。水果战争博客
1.水果有什么新鲜事?
1.苹果是最好的
2.苹果的蛋糕
2.关于水果的文章
1.苹果与香蕉
1.介绍:
2。问题:

所以< section> 被认为具有两个完全不同且不相关的语义含义?



是否正确使用:

 <! -  MY DOUBT  - > 
<节> <! - 用作容器 - >
<文章>
< section>< / section> <! - 用作章节 - >
< / article>
< / section>

以这种内敛的方式吗?

我发现是可能的,以相反的方式使用:

 <! -  FROM W3C  - > 
<文章> <! - BLOG ENTRY - >
< section> <! - 用作关于评论的章节 - >
<文章>< / article> <! - 评论 - >
< / section>
< / article>

但是我找不到我下面写的方式的答案。



我猜读W3C小组撰写< section> 标签的基础的讨论可能很有用,但我可以找不到它。



注意我正在寻找回复记录的回复

w3.org/wiki/HTML/Elements/sectionrel =nofollow noreferrer> http://www.w3.org/wiki/HTML/Elements/section not the官方定义部分部分 HTML5规范中定义的,目前是候选推荐标准(这是 Editor's Draft )。



在CR中,部分定义为:


部分元素代表一个通用部分文件或申请。在这种情况下,一个部分是内容的主题分组,通常带有一个标题。

section 分段内容元素(连同文章一边 nav )。这些分段元素和标题( h1 - h6 )会创建一个 outline

以下三个例子在语义上是等价的(相同的含义,相同的概要):

 <! - 示例1:仅使用标题 - > 
< h1>我的第一天< / h1>
< p> ...< / p>
< h2>唤醒< / h2>
< p> ...< / p>
< h2>大时刻!< / h2>
< p> ...< / p>
< h2>睡觉< / h2>
< p> ...< / p>

<! - 示例1:使用具有相应标题级别的节元素 - >
<节>
< h1>我的第一天< / h1>
< p> ...< / p>
<节>
< h2>唤醒< / h2>
< p> ...< / p>
< / section>
<节>
< h2>大时刻!< / h2>
< p> ...< / p>
< / section>
<节>
< h2>睡觉< / h2>
< p> ...< / p>
< / section>
< / section>

<! - 示例1:随处使用带h1的节元素>
< section>
< h1>我的第一天< / h1>
< p> ...< / p>
< section>
< h1>唤醒< / h1>
< p> ...< / p>
< / section>
< section>
< h1>大时刻!< / h1>
< p> ...< / p>
< / section>
< section>
< h1>睡觉< / h1>
< p> ...< / p>
< / section>
< / section>

因此您可以使用部分 每当(*)使用 h1 - h6 。当您需要大纲中的单独条目但不能(或不想)使用标题时,您可以使用部分



另请注意, 标题 footer 总是属于它最接近的祖先切片内容(或切片根,比如 body ,如果没有sectioning元素)元素。换句话说:每个部分 / 文章 / 抛开 / nav 元素可以有自己的 / 页脚



文章抛开 nav 可以说是部分元素的更具体变体。







两种完全不同的用例

这两个用例完全不同。在容器的情况下,你可以说部分表示文档的一个章节,而在章节情况下部分表示文章/内容的一个章节(当然,它是文档的一部分)。

同样,一些标题用于标题网页部分(如导航,用户菜单,评论等)和一些标题用于标题内容(我的第一天,我最喜欢的书等)。 >

I know there are tons of questions about this topic but I can't find an authoritative source for the answer.

This is the official definition and the wiki page, and there there is more documentation, but there they don't explain the correct usage if not in a very simple examples or in different ways.

What I've "understood" so far:

<section> defines a part(section) of the page, like blogrolls, headlines news, blog entries list, comments list, and everything which can be with a common topic.

<article> defines a content which has sense estranged from the rest of the page (?) and which has a single topic (blog entry, comment, article, etc).

But, inside an <article>, we can split parts of it in sections using <section>, and in this case it has the function of container to mark chapters of a bigger text.


The doubt

If these sentences are correct (or partially correct) that means that <section> has two completly different usage cases.

We could have a page written in this way:

<!DOCTYPE html>
<html lang=en>
    <head>
        <meta charset=utf-8>
        <title>Fruits</title>
    </head>

    <body>

        <h1>Fruits war blog</h1>

        <section id="headlineNews"> <!-- USED AS CONTAINER -->

            <h1>What's new about fruits?</h1>   
            <article><h1>Apples are the best</h1>Apples are better than bananas</article>
            <article><h1>Apple's cakes</h1>With apples you can prepare a cake</article>

        </section>

        <section id="blogEntries"> <!-- USED AS CONTAINER -->

            <h1>Articles about fruits</h1>

            <article>
                <h1>Apples vs Bananas</h1>
                <section>  <!-- USED AS CHAPTER -->
                    <h2>Introduction:</h2>
                    Bananas have always leaded the world but...
                </section>
                <section>  <!-- USED AS CHAPTER -->
                    <h2>The question:</h2>
                    Who is the best? We don't know so much about apples...
                </section>
            </article>

        </section>

    </body>
</html>

And this is how looks the Outline:

1. Fruits war blog
   1. What's new about fruits?
      1. Apples are the best
      2. Apple's cakes
   2. Articles about fruits
      1. Apples vs Bananas
         1. Introduction:
         2. The question:

So the <section> is thought with two completly different and not related semantic meanings?

Is it correct use:

<!-- MY DOUBT -->
<section> <!-- USED AS CONTAINER -->
  <article>
    <section></section> <!-- USED AS CHAPTER -->
  </article>
</section>

in this neasted way?
I've found that is possible to use in the inversed way:

<!-- FROM W3C -->
<article> <!-- BLOG ENTRY -->
  <section> <!-- USED AS CHAPTER ABOUT COMMENTS -->
    <article></article> <!-- COMMENT -->
  </section>
</article>

But I can't find an answer to the way I've written below.

I guess read the discussion where the W3C group has wrote the basis of the <section> tag could be useful but I can't find it.

N.B. I'm looking for replies documented with authorative sources

解决方案

http://www.w3.org/wiki/HTML/Elements/section is not the official definition of section. section is defined in the HTML5 specification, which currently is a Candidate Recommendation (which is a snapshot of the Editor’s Draft).

In the CR, section is defined as:

The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.

section is a sectioning content element (together with article, aside and nav). Those sectioning elements and the headings (h1-h6) create an outline.

The following three examples are semantically equivalent (same meaning, same outline):

<!-- example 1: using headings only -->
<h1>My first day</h1>
<p>…</p>
<h2>Waking up</h2>
<p>…</p>
<h2>The big moment!</h2>
<p>…</p>
<h2>Going to bed</h2>
<p>…</p>

<!-- example 1: using section elements with corresponding heading levels -->
<section>
  <h1>My first day</h1>
  <p>…</p>
  <section>
    <h2>Waking up</h2>
    <p>…</p>
  </section>
  <section>
    <h2>The big moment!</h2>
    <p>…</p>
  </section>
  <section>
    <h2>Going to bed</h2>
    <p>…</p>
  </section>
</section>

<!-- example 1: using section elements with h1 everywhere -->
<section>
  <h1>My first day</h1>
  <p>…</p>
  <section>
    <h1>Waking up</h1>
    <p>…</p>
  </section>
  <section>
    <h1>The big moment!</h1>
    <p>…</p>
  </section>
  <section>
    <h1>Going to bed</h1>
    <p>…</p>
  </section>
</section>

So you can use section whenever (*) you use h1-h6. And you use section when you need a separate entry in the outline but can’t (or don’t want to) use a heading.

Also note that header and footer always belong to its nearest ancestor sectioning content (or sectioning root, like body, if there is no sectioning element) element. In other words: each section/article/aside/nav element can have its own header/footer.

article, aside and nav are, so to say, more specific variants of the section element.


two completly different usage cases

These two use-cases are not that different at all. In the "container" case, you could say that section represents a chapter of the document, while in the "chapter" case section represents a chapter of the article/content (which, ouf course, is part of the document).

In the same way, some headings are used to title web page parts (like "Navigation", "User menu", "Comments", etc.), and some headings are used to title content ("My first day", "My favorite books", etc.).

这篇关于HTML5部分标签的含义?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆