HTML5 定義區(qū)塊

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

    section表示區(qū)塊，用于標(biāo)識(shí)文檔中的節(jié)，多用于對(duì)內(nèi)容進(jìn)行分區(qū)，如章節(jié)、頁(yè)眉、頁(yè)腳或文檔中的其他部分。

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

【示例1】下面的代碼把主體區(qū)域劃分3個(gè)獨(dú)立的區(qū)塊。

<main role="main">

    <hl>主要標(biāo)題</h1>

    <section>

        <h2>g塊標(biāo)題 l</h2>

        <ul> [標(biāo)題列表</ul>

    </section>

    <section>

        <h2>區(qū)塊標(biāo)題2</h2>

        <ul> [標(biāo)題列表</ul>

    </section>

    <section>

        <h2>E塊標(biāo)題3</h2>

        <ul>[標(biāo)題列表</ul>

    </section>

</main>

【示例2】幾乎任何新聞網(wǎng)站都會(huì)對(duì)新聞進(jìn)行分類。每個(gè)類別都可以標(biāo)記為一個(gè)section。

<hl>網(wǎng)頁(yè)標(biāo)題</h1>

<section>

    <h2>E塊標(biāo)題 l</h2>

    <ol>

        <1;1>列表項(xiàng)目l</li>

        <1;1>列表項(xiàng)目2</li>

        <1;1>列表項(xiàng)目3</li>

    </o1>

</section>

<section>

    <h2>區(qū)塊標(biāo)題2</h2>

    <ol>

        <li>列表項(xiàng)目l</li>

    </ol>

</section>