定義和用法

<section> 標簽定義文檔中的節（section、區段）。比如章節、頁眉、頁腳或文檔中的其他部分。

註意：

• section 不是一個專用來做容器的標簽，如果僅僅是用於設置樣式或腳本處理，專用的是 div
• section 裏應該有 標題（h1~6），但文章中推薦用 article 來代替
• 一條簡單的準則是，只有元素內容會被列在文檔大綱中時，才適合用section元素。
• section的作用是對頁面上的內容進行分塊，如各個有標題的版塊、功能區或對文章進行分段，不要與有自己完整、獨立內容的article混淆。

你如何理解 HTML5 的 section？會在什麽場景使用？為什麽這些場景使用 section 而不是 div？

一個section通常由內容和標題組成，通常不推薦那些沒有標題的內容用section，在HTML 5 Outliner這個網站可以檢測沒有標題的section，section的作用是對頁面上的內容進行分塊，如各個有標題的版塊、功能區或對文章進行分段，不要與有自己完整、獨立內容的article混淆。

使用<section>

以下內容來自：慎用section標簽

<section>可以相互嵌套，在頁面中定義了一個特殊的頂級區塊，於是可以從<h1>開始列提綱而不用擔心會破壞網頁的綱要。盡管沒找到明確說明，但我個人認為在每一層<section>裏還是僅使用一個<h1>為佳。

以Wordpress主題為例，我認為與#sidebar相對的#content部分，使用<section>包裹一堆<article>作為頁面的主要內容並不太合適。而使用<section>用在整體布局是明顯錯誤的了。而適合使用<section>標簽的地方有：

• 文章的評論列表，有著整齊的結構；
• 文章內容的目錄，有著文章內部結構綱要；
• 側欄widget，在WebDesignWall中我看到了這樣的設計，因為widget內容大都是評論列表、文章列表，有著清晰的結構且是獨立完整的一部分；
• 包裹文章中各個章節的段落，但要在編輯器完成，目前來看並不易用。

舉例說明

以以下內容來自 你如何理解 HTML5 的 section？會在什麽場景使用？為什麽這些場景使用 section 而不是 div？ 問題中知乎用戶的回答

拿報紙舉個例子：
一份或一張報紙有很多個版塊，有頭版、國際時事版塊、體育版塊、娛樂版塊、文學版塊等等，像這種有版塊標題的、內容屬於一類的版塊就可以用section包起來。
然後在各個版塊下面，又有很多文章、報道，每篇文章都有自己的文章標題、文章內容。這個時候用article就最好。如果一篇報道太長，分好多段，每段都有自己的小標題，這時候又可以用section把段落包起來。

雖然這些標簽有這個有那個的限制，官方規範建議也是模模糊糊的，但是不要忘記了html5語義化標簽的意義，其中一個就是更方便開發人員閱讀代碼文檔，理清代碼結構。個人覺得，如果能方便自己和他人閱讀理解的標簽，那就大膽用吧。

為什麽要用

    <section>
        <h1>WWF</h1>
        <p>The World Wide Fund for Nature (WWF) is....</p>
    </section>

div\section\article各自適用場景：

推薦文章：慎用section標簽

html5筆記——<section> 標簽