結構元素不具有任何樣式，只是使頁面元素的的語義更加明確。

header元素

header元素是一種具有引導和導航作用的的結構元素，該元素可以包含所有通常放在頁面頭部的內容。header元素通常用來放置整個頁面或頁面內的一個內容區塊的標題，也可以包含網站Logo圖片、搜尋表單或者其他相關內容。

<header>
    <h1>網頁主題</h1>
</header>

一個網頁中可以使用多個header元素，也可以為每一個內容塊新增header元素。

nav元素

nav元素用於定義導航連結，是html5新增的元素。該元素可以將具有導航性質的連結歸納在一個區域中

nav元素通常可以用於以下場合中：

• 傳統導航條
• 側邊欄導航
• 頁內導航
• 翻頁操作

<nav>
    <ul>
        <li><a href="#">首頁</a></li>
        <li><a href="#">公司概況</a></li>
        <li><a href="#">產品展示</a></li>
        <li><a href="#">聯絡我們</a></li>
    </ul>
</nav>
 

article元素

article元素代表文件、頁面或者應用程式中與上下文不相關的獨立部分，該元素經常被用於定義一篇日誌、一條新聞或使用者評論等。article元素通常使用多個section元素進行劃分，一個頁面中article元素可以出現多次。

<article>
    <header>
        <h1>第一章</h1>

    </header>
    <section>
        <header>
            <h2>第1節</h2>
        </header>
    </section>
    <section>
        <header>
            <h2>第2節</h2>
        </header>
    </section>
</article>
 

aside元素

aside元素用來定義當前頁面或者文章的複數資訊部分，它可以包含與當前頁面或主要內容相關的引用、側邊欄、廣告、導航條等其他類似的有別於主要內容的部分。

aside元素主要的用法分為兩種：

• 被包含在article元素內作為主要內容的附屬資訊。
• 在article元素之外使用，作為頁面或者站點全域性的附屬資訊部分。最常用的形式是側邊欄，其中的內容可以使友情連結、廣告單元等。

`<article>
    <header>
        <h1>標題</h1>
    </header>
    <section>文章主要內容</section>
    <aside>其他相關內容</aside>
</article>
<aside>右側選單</aside>`

section元素

section元素用於對網站或應用程式中頁面上的內容進行分塊，一個section元素通常由內容和標題組成。在使用section元素時，需要注意一下三點：

• 不要將section元素用作設定樣式的頁面容器，那是div的特性。
• 如果article元素、aside元素或nav元素更符合使用條件，那麼不要使用section元素。
• 沒有標題的內容區塊不要使用section元素定義。

<article>
    <header>
        <h2>小張的個人介紹</h2>
    </header>
    <p>小張是一個好學生，是一個帥哥。。。</p>
    <section>
        <h2>評論</h2>
        <article>
            <h3>評論者：A</h3>
            <p>小張真的很帥</p>
        </article>
        <article>
            <h3>評論者：B</h3>
            <p>小張是一個好學生</p>
        </article>
    </section>
</article>`

在html5中，article元素可以看作是一種特殊的section元素，它比section元素更具有獨立性，即section元素強調分段或分塊，而article元素強調獨立性。如果一塊內容相對來說比較獨立、完整時，應該使用article元素；但是如果想要將一塊內容分成多段時，應該使用section元素。

電腦刺繡繡花廠 http://www.szhdn.com 廣州品牌設計公司https://www.houdianzi.com

footer元素

footer元素用於定義一個頁面或者區域的底部，它可以包含所有通常放在頁面底部的內容。與header元素相同，一個頁面中可以包含多個footer元素。同時，也可以在article元素或者section元素中新增footer元素。

`<article>
    文章內容
    <footer>
        文章分頁列表
    </footer>
</article>
<footer>
    頁面底部
</footer>`