4

在 HTML5 草案规范中添加<main>元素后,哪个页面布局更正确?

<body>
    <header> ... </header>
    <main>
        <aside> ... </aside>
    </main>
    <footer> ... </footer>
</body>

或者;

<body>
    <header> ... </header>
    <section>
        <main> ... </main>
        <aside> ... </aside>
    </section>
    <footer> ... </footer>
</body>
4

3 回答 3

7

关于每个示例标记模式的正确性的答案可以在主要元素的规范定义中找到。

可以使用此元素的上下文:需要流式内容,但没有文章、旁边、页脚、页眉或导航元素祖先的地方。作者不得在文档中包含多个主要元素。

在这种情况下,任一示例标记都符合要求。仅从理论示例很难知道哪个是最合适或最实用的。

浏览器遵循哪个规范?

浏览器已经实现了W3C HTML 规范中定义的主要元素。W3C HTML 验证器等一致性检查器将实现 W3C HTML 规范的一致性要求。

注意:主要元素将在不久的将来添加到 HTML 5.0 。

注意: HTML 5.1 中主要元素的规范取代了扩展规范。

于 2013-02-12T03:39:17.687 回答
2

As always it depends on the content.

For me, if the contents of the header and footer are generic to all pages, then leave them outside of the main element whose content should be specific to that page. If, however, the header and/or footer are relevant to the main contents of that page only, then put them inside the main.

The same logic applies to the aside element.

Plus read what Steve Faulkner says on this page. He knows everything!

Update! Due to this particular question, I have posted an article with further examples on how the main element might be used.

于 2013-02-12T11:51:01.727 回答
0

在第二个示例中,您将 <main> 放置在 <section> 中。

由于 <body> 隐含地是一个“节”并且 <section> 属于它,因此 <section> 实际上是一个小节。

这会导致问题。

为什么?

正如史蒂夫指出的那样,您每页只能使用 <main> 一次。在此示例中,您已选择在该页面的一个子部分中使用定义页面主要部分的一个元素。

某事物的“主要”部分肯定不能属于该事物的子集。无论根据当前规范“允许”做什么,这根本没有意义。在此示例中,您对 <main> 的部署与您使用分段内容所描述的结构意图不一致。

在结构方面,第一个示例 - 因此 - 稍微优越,尽管您对 <aside>的语义选择不是最佳的。您基本上说过,“这是我页面内容中最重要的部分,其中包含一些切线、松散相关的内容”。与什么相切?

除非...

您打算将一些流内容直接放在 <main> 区域内,与 <aside> 相邻。该内容将直接属于 main,而 main 则直接属于 <body>。<aside> 仍然是 <body> 的一个子部分,实际上是某些主要内容的“旁白”。

这将是完全合理的。

于 2013-02-12T13:32:20.943 回答