多个< article> < section>中的元素放在< ul>中标签? [英] Should multiple <article> elements in a <section> be put it in <ul> tags?

问题描述

我正在使用新的HTML5标签，并且想知道以下两个选项中的哪一个更可取:

I'm using the new HTML5 tags and and I was wondering which of the following two options is preferable:

选项1

<article class="menu">
  <section>
    <header>
      <h4>Breakfast</h4>
    </header>
    <ul>
      <li>
        <article class="menu-item">Cereal</article>
      </li>
      <li>
        <article class="menu-item">Bacon & Eggs</article>
      </li>
      <li>
        <article class="menu-item">Waffles</article>
      </li>
    </ul>
  </section>
  <section>
    <header>
      <h4>Lunch</h4>
    </header>
    <ul>
      <li>
        <article class="menu-item">Peanut Butter & Jelly</article>
      </li>
      <li>
        <article class="menu-item">Ham Sammich</article>
      </li>
      <li>
        <article class="menu-item">Soup</article>
      </li>
    </ul>
  </section>
</article>

选项2

<article class="menu">
  <section>
    <header>
      <h4>Breakfast</h4>
    </header>
    <article class="menu-item">Cereal</article>
    <article class="menu-item">Bacon & Eggs</article>
    <article class="menu-item">Waffles</article>
  </section>
  <section>
    <header>
      <h4>Lunch</h4>
    </header>
    <article class="menu-item">Peanut Butter & Jelly</article>
    <article class="menu-item">Ham Sammich</article>
    <article class="menu-item">Soup</article>
  </section>
</article>

由于HTML 4.01遗留下来的习惯，我目前正在将第一个选项与标签一起使用，但是在我看来，它们在HTML5中是完全多余且不必要的.哪个更正确?

I'm currently using the first option with the tags due to habits leftover from HTML 4.01, however it seems to me that they are completely redundant and unnecessary in HTML5. Which is more correct?

例如，在本文中，它们不使用标签:

For example, in this article here they don't use tags: http://net.tutsplus.com/tutorials/html-css-techniques/html-5-and-css-3-the-techniques-youll-soon-be-using/

推荐答案

应该吗?不必要.能?是的.

Should? Not necessarily. Can? Yes.

在某种情况下，我正在做与< figure>的第一个示例类似的操作.在这种情况下，包含元素是< nav>.这些数字是带有照片和标题的项目列表.它是也是数字的导航项目的列表.因此nav> ...> &图.

I have a situation in which I am doing something similar to your first example with <figure>. In this case the containing element is <nav>. The figures are a list of items with a photo and title. It is a list of navigation items which are also figures. Thus nav > ... > li > figure.

当然，数字不是文章.但规范同时允许< figure>和< article>允许. < li>的允许内容是流内容"，其中包括

A figure isn't an article, of course. But it is permitted by the spec with both <figure> and <article>. Permitted contents of <li> are "flow content", which includes,

section 或 nav 或 article 或 aside 或 header 或页脚或图

还有其他.整个清单很长.因此，这取决于您在特定情况下的感觉.

Among others. The whole list is long. So it depends on what feels right to you in your specific situation.

• 这些文章摘要是否可作为按日期排序的文章全文的导航?如果我想要< li>作为额外的容器，或者因为我喜欢这种方式，我可能会做与上面的图类似的事情.
• 这是文章的全文，而不是您认为是文章列表的东西吗?省略列表.

这篇关于多个&lt; article&gt; &lt; section&gt;中的元素放在&lt; ul&gt;中标签?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！