HTML5 定義主要區(qū)域

    ■知識(shí)點(diǎn)

    main表示主要區(qū)域，用來(lái)標(biāo)識(shí)網(wǎng)頁(yè)中的主要內(nèi)容。main內(nèi)容對(duì)于文檔來(lái)說(shuō)應(yīng)當(dāng)是唯一的，它不應(yīng)包含在網(wǎng)頁(yè)中重復(fù)出現(xiàn)的內(nèi)容，如側(cè)邊欄、導(dǎo)航欄、版權(quán)信息、站點(diǎn)標(biāo)志或搜索表單等。

    簡(jiǎn)單地說(shuō)，在一個(gè)頁(yè)面中，不能出現(xiàn)一個(gè)以上的main元素。main元素不能被放在article> aside、footer、header或nav中。由于main元素不對(duì)頁(yè)面內(nèi)容進(jìn)行分區(qū)或分塊，所以不會(huì)對(duì)網(wǎng)頁(yè)大綱產(chǎn)生影響。

    ■實(shí)例設(shè)計(jì)

    下面頁(yè)面是一個(gè)完整的主體結(jié)構(gòu)。main元素包圍著代表頁(yè)面主題的內(nèi)容。

    <header role="banner">

    <nav role="navigation"> [包含多個(gè)鏈接的ul] </nav>

    </header>

    <main role="main">

    <article>

    <hl id="gaudi">主要標(biāo)題</hl>

    <p> [頁(yè)面主要區(qū)域的其他內(nèi)容]

    </article>

    </main>

    <aside role="complementary">

    <hl>側(cè)邊標(biāo)題</h1>

    <p>[附注欄的其他內(nèi)容]

    </aside>

    <footer role="info">[版權(quán)]</footer〉