HTML 5 是新标签 header/nav/aside/section 等容器,如 div?

HTML 5 are the new tags header/nav/aside/section etc containers like div?

正如标题所说,我是否必须在 DIV 中使用这些新标签,或者它们基本上是 DIV 本身?

每个主要 HTML5 标签 can/should 的使用方式如下:

section – Used for grouping together thematically-related content. Sounds like a div element, but it’s not. The div has no semantic meaning. Before replacing all your div’s with section elements, always ask yourself: “Is all of the content related?”

aside – Used for tangentially related content. Just because some content appears to the left or right of the main content isn’t enough reason to use the aside element. Ask yourself if the content within the aside can be removed without reducing the meaning of the main content. Pullquotes are an example of tangentially related content.

header – There is a crucial difference between the header element and the general accepted usage of header (or masthead). There’s usually only one header or ‘masthead’ in a page. In HTML5 you can have as many as you want. The spec defines it as “a group of introductory or navigational aids”. You can use a header in any section on your site. In fact, you probably should use a header within most of your sections. The spec describes the section element as “a thematic grouping of content, typically with a heading.”

nav – Intended for major navigation information. A group of links grouped together isn’t enough reason to use the nav element. Site-wide navigation, on the other hand belongs in a nav element.

footer – Sounds like its a description of the position, but its not. Footer elements contain informations about its containing element: who wrote it, copyright, links to related content, etc. Whereas we usually have one footer for an entire document, HTML5 allows us to also have footer within sections.

<header>

<header> 元素表示介绍性内容或一组导航链接的容器。

一个元素通常包含:

一个或多个标题元素 (-) 徽标或图标作者信息您可以在一个文档中包含多个元素。

注意:<header> 标签不能放在 , 或其他元素中。


<nav>

<nav> 标签定义了一组导航链接。

请注意,并非文档的所有链接都应位于 <nav> 元素内。 <nav> 元素仅适用于主要的导航链接块。


<aside>

<aside>标签定义了一些内容,除了它所在的内容。 旁白内容要与周边内容相关


<section>

<section> 标签定义文档中的部分,例如章节、headers、页脚或文档的任何其他部分。