Ostatnio edytowany:

header

Autor: Virtual Patriot

Przeznaczenie elementu header

Element header reprezentuje zawartość, którą powinna być treść wstępu do treści reprezentowanej przez zawartość pierwszego w kolejności elementu przodka danego elementu header, który to element przodek należy do kategorii sekcja zawartości lub do kategorii korzeń sekcji. Zawartością elementu header może być: nagłówek zawartości, elementy HTML tworzące nawigację pomiędzy częściami sekcji zawartości oraz każda inna treść, którą uznamy za wspomnianą treść wstępu.

Dodatkowe techniczne informacje o elemencie header

kategoria ogólna
kontekst zewnętrzny
  • element HTML, który tworzy wewnętrzny kontekst opływający

    Przykładowy Kod HTML

    <article>
      <header>
        <h1>Mój ulubiony owoc</h1>
        <img src="owoc-01.png" alt="zdjęcie czereśni">
      </header>
    
      <p>
        Moim ulubionym owocem jest czereśnia.
      </p>
    </article>

    Kontekstem zewnętrznym przykładowego elementu "header" 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 "header".

kontekst wewnętrzny
  • zawartość opływająca, lecz nie następujące elementy HTML jako elementy potomkowie: header, footer, main

    Przykładowy Kod HTML

    <article>
      <header>
        <h1>Mój ulubiony owoc</h1>
        <img src="owoc-01.png" alt="zdjęcie czereśni">
      </header>
    
      <p>
        Moim ulubionym owocem jest czereśnia.
      </p>
    </article>

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

wymagane elementy dzieci
  • brak
wymagane atrybuty
  • brak
składnia HTML
  • <header> ... </header>
pominięcie tagu na początku
  • nigdy
pominięcie tagu na końcu
  • nigdy
CSS display
  • block

Dodatkowe domyślne reguły CSS elementu header

header {
  display:block;
}

Interpretacja elementu header

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak, lecz od wersji 9

Edge

tak

Zobacz więcej informacji o interpretacji elementu .