HTML Elemento principale


Esempio

L'elemento <main> contiene il contenuto principale per la tua pagina web. Questo contenuto è unico per la singola pagina e non dovrebbe apparire altrove sul sito. I contenuti ripetuti come intestazioni, piè di pagina, navigazione, loghi, ecc. Vengono posizionati all'esterno dell'elemento.

  • L'elemento <main> dovrebbe essere usato sempre al massimo una sola volta su una singola pagina.
  • L'elemento <main> non deve essere incluso come discendente di un article , a aside , il footer , l' header o l'elemento di nav .

Nell'esempio seguente, stiamo visualizzando un singolo post sul blog (e informazioni correlate come riferimenti e commenti).

<body>
    <header>
        <nav>...</nav>
    </header>

    <main>
        <h1>Individual Blog Post</h1>
        <p>An introduction for the post.</p>

        <article>
            <h2>References</h2>
            <p>...</p>
        </article>

        <article>
            <h2>Comments</h2> ...
        </article>
    </main>

    <footer>...</footer>
</body>
  • Il post del blog è contenuto all'interno dell'elemento <main> per indicare che questo è il contenuto principale di questa pagina (e quindi unico nel suo genere sul sito Web).

  • I <header> e <footer> sono fratelli dell'elemento <main> .


Gli appunti:

La specifica HTML5 riconosce l'elemento <main> come un elemento di raggruppamento e non un elemento di sezione .

Aggiungere un role="main" attributo del ruolo ARIA ad altri elementi destinati ad essere utilizzati come contenuto principale è consigliato per aiutare gli interpreti che non supportano HTML5 e anche per fornire più contesto per quelli che lo fanno.

L'elemento <main> di default ha il ruolo principale e quindi non ha bisogno di essere fornito.

Clicca qui per leggere la specifica ufficiale HTML5 per l'elemento <main>