我读了很多关于w3schools的信息。 它将<section>定义为:

<section>元素定义文档中的一个部分。 [...]主页通常可以分为几个部分,用于介绍,内容和联系信息。

那么,基本上, <section>可以是<header> (简介)和<footer> (联系信息)?

<header>元素指定文档或节的标题。

所以我可以 <section>放一个<header> <section> 但是<section>可以用于“引入”,所以它基本上一个标题? <footer>元素相同的故事。

问题

我怎么实际上应该使用这些元素?

  • 我应该使用<header>作为<article>的标题还是包含徽标和导航的网站部分?

  • 我应该使用<footer>作为<article>的数据还是我的网站包含版权和页脚导航的部分?

  • 我应该 <article>标签周围添加<section> <article>标签吗?

假设我有一个简单的网站,包含徽标,导航,几篇文章和一些页脚文本。 做标记的最佳方法是什么?

 <!DOCTYPE html> <html> <head> <title>My site</title> </head> <body> <header> <img src="logo.png" alt="My logo!"> <nav> <ul> <li><a href="#">Item 1</a></li> <li><a href="#">Item 2</a></li> <li><a href="#">Item 3</a></li> </ul> </nav> </header> <section> <article> <header><h2>Article 1 title</h2></header> <footer>Posted on Foo.Bar.2017</footer> </article> <article> <header><h2>Article 2 title</h2></header> <footer>Posted on Foo.Bar.2017</footer> </article> <article> <header><h2>Article 3 title</h2></header> <footer>Posted on Foo.Bar.2017</footer> </article> </section> <footer> <p>Copyright</p> </footer> </body> </html> 

如果我这样做, Nu HTML Checker说:

警告:科缺乏标题。 考虑使用h2-h6元素为所有部分添加标识标题。

我不希望<h1>声明<section>包含<article>标签。 我应该删除<section>吗? 它似乎是一个灵活的标签,但我找不到一个有效的地方来放它。

什么是正确的标记?

===============>>#1 票数:2 已采纳

header / footer

分段内容分段根元素。 header / footer元素始终“属于”这些分段(内容/根)元素之一。

<body>

  <header>belongs to the 'body'</header>

  <article>
    <header>belongs to the 'article'</header>
    <footer>belongs to the 'article'</footer>
  </article>

  <div>
    <header>belongs to the 'body'</header>
    <footer>belongs to the 'body'</footer>
  </div>

  <footer>belongs to the 'body'</footer>

</body>

请注意, div元素不是sectioning元素,这就是它的header / footer子元素属于body (它是一个切片根元素)而不是div

因此,您可以通过放置header / footer元素来使用header / footer元素,以便它们最近的切片父元素是body元素。

section

header / footer可以包含一个或多个section元素,但这通常只有在header / footer (异常)复杂时才有意义。

一般来说,何时使用section有意义的? 如果您有隐式部分 ,或者您需要文档大纲中的条目。 请参阅我的相关答案:

请注意,当分区内容元素没有标题元素时验证程序会报告警告,而不是错误 它们不需要标题,但可以表明分段内容元素被滥用:如果它可以有标题,通常只有使用它才有意义,即使你实际上没有提供标题。

===============>>#2 票数:0

标题与标题不同。 对标题(页眉)使用<header>标记,为标题使用<h1>到<h6>(标题,副标题等)。 这是标题和标题之间的区别。 除了你的标记看起来合乎逻辑,除了标题标题问题,我不会使用<footer> - 页脚的标记来显示一些数据,如日期或作者。

HTML5语义非常合乎逻辑 - <header>,<nav>,<main>内容,主要内容的内容,<aside>内容等......

但<article>可以是<section>的一部分。 部分也可以是文章的一部分。 所以我的观点是,如果你遵循HTML标签的逻辑,你不必太担心语义。

哦,回答你的问题。 我会这样做:

<section>
    <article>
        <h2>Article 1 title</h2>
        <p>Posted on Foo.Bar.2017</p>
    </article>

    <article>
        <h2>Article 2 title</h2>
        <p>Posted on Foo.Bar.2017</p>
    </article>
</section> 

如果需要,您可以将<time>标签与<p>标签一起使用,但我不会(因为兼容性)

  ask by Hristiyan Dodov translate from so

未解决问题?本站智能推荐: