section

Element section reprezentuje sekcję typu section, której głównym przeznaczeniem jest grupowanie zawartości znajdującej się w części BODY dokumentu HTML na różne tematyczne sekcje.

• Progres V - Sekcja zawartości określonego typu
• Progres V - Podsekcja sekcji zawartości określonego typu
• Progres V - Podsekcja korzenia sekcji
• Progres VI - Sekcja zawartości typu "section"

kategoria ogólna

• zawartość opływająca

• sekcja zawartości

• zawartość namacalna

kontekst zewnętrzny

element HTML, który tworzy wewnętrzny kontekst opływający

Przykładowy Kod HTML

<article>
  <h1>Mój ulubiony owoc</h1>
  <p>Moim ulubionym owocem jest czereśnia.</p>

  <section>
    <h2>Owoce, które również lubię</h2>

    <article>
      <h3>Truskawka</h3>
      <img src="owoc-01.png" alt="zdjęcie truskawki">
    </article>

    <article>
      <h3>Kiwi</h3>
      <img src="owoc-02.png" alt="zdjęcie kiwi">
    </article>
  </section>
</article>

Kontekstem zewnętrznym przykładowego elementu "section" jest element "article". Wspomniany element "article" jest jednym z elementów HTML, które tworzą wewnętrzny kontekst opływający, dlatego w tej sytuacji wspomniany kontekst zewnętrzny, czyli element "article", jest prawidłowym kontekstem zewnętrznym dla elementu "section".

kontekst wewnętrzny

zawartość opływająca

Przykładowy Kod HTML

<article>
  <h1>Mój ulubiony owoc</h1>
  <p>Moim ulubionym owocem jest czereśnia.</p>

  <section>
    <h2>Owoce, które również lubię</h2>

    <article>
      <h3>Truskawka</h3>
      <img src="owoc-01.png" alt="zdjęcie truskawki">
    </article>

    <article>
      <h3>Kiwi</h3>
      <img src="owoc-02.png" alt="zdjęcie kiwi">
    </article>
  </section>
</article>

Kontekstem wewnętrznym przykładowego elementu "section" są wyłącznie elementy HTML, które należą do kategorii zawartość opływająca, dlatego w tej sytuacji wspomniany kontekst wewnętrzny, czyli element "h2", element "article" oraz element "article", jest prawidłowym kontekstem wewnętrznym dla elementu "section".

wymagane elementy dzieci

brak

wymagane atrybuty

brak

zdolność fallback

nie dotyczy

składnia HTML

<section> ... </section>

pominięcie tagu na początku

nigdy

pominięcie tagu na końcu

nigdy

CSS display

• block (jeżeli przeglądarka internetowa interpretuje element section)

• inline (jeżeli przeglądarka internetowa nie interpretuje elementu section)

/* jeżeli przeglądarka internetowa interpretuje element "section" */
section {
  display:block;
}

tak

tak

tak

tak

tak, lecz od wersji 9

tak

Zobacz więcej informacji o interpretacji elementu section.