<section>

Element <section> stanowi samodzielną sekcję tworzącą dokument HTML, której nie można przedstawić za pomocą bardziej szczegółowej semantycznie sekcji. Element <section> zazwyczaj posiada nagłówek.

Przykładowo, część nawigacyjna powinna być objęta elementem <nav>, ale lista wyników wyszukiwania albo wyświetlana mapa i jej sterowanie nie mają dla siebie szczegółowego elementu, więc powinny zostać umieszczone w <section>.

Content categories Flow content, Sectioning content, palpable content.
Permitted content Flow content.
Tag omission None, both the starting and ending tag are mandatory.
Permitted parents Any element that accepts flow content. Note that a <section> element must not be a descendant of an <address> element.
Permitted ARIA roles alert, alertdialog, application, banner, complementary, contentinfo, dialog, document, feed, log, main, marquee, navigation, search, status, tabpanel
DOM interface HTMLElement

Atrybuty

Element zawiera tylko global attributes.

Użycie

  • Każdy element <section> powinien zazwyczaj zawierać nagłówek (<h1>-<h6>) jako element potomny <section>.
  • Jeśli jest konieczne oddzielić podgrupy w treści elementu <section>,  używa się elementów<article>.
  • Nie używa się elementu <section> w celu stworzenia ogólnego kontenera; do tego służy element <div>, szczególnie nie robi się tego jesli ma to służyć tylko do nadania stylów. Praktyczną zasadą jest to, że wsytąpeinie elementu <section> powinną być logiczne w schemacie dokumentu.

Przykład 1

Wcześniej

<div>
  <h1>Heading</h1>
  <p>Bunch of awesome content</p>
</div>

Teraz

<section>
  <h1>Heading</h1>
  <p>Bunch of awesome content</p>
</section>

Przykład 2

Wcześniej

<div>
  <h2>Heading</h2>
  <img src="bird.jpg" alt="bird">
</div>

Teraz

<section>
  <h2>Heading</h2>
  <img src="bird.jpg" alt="bird">
</section>

Specyfikacje

Zgodność z przeglądarkami

BCD tables only load in the browser

Zobacz również