Obszar nagłówka
- Data publikacji
- Ostatnio edytowano
Jak już wiemy z poprzednich części tego kursu HTML każdy element HTML należący do kategorii sekcja zawartości, jak również każdy element HTML należący do kategorii korzeń sekcji może posiadać swój własny nagłówek reprezentowany przez któryś z elementów HTML należących do kategorii nagłówek zawartości.
Przykład:
<article>
<h1>Mój ulubiony kolor</h1>
<p>
Moim ulubionym kolorem jest kolor błękitny.
</p>
<p>
Ponieważ błękitny to kolor nieba.
</p>
</article>
W naszym przykładowym kodzie HTML występuje jeden element HTML, który może posiadać swój własny nagłówek. Wspomnianym elementem HTML jest element article
tworzący sekcję zawartości typu article
. Wspomniany element article
posiada swój własny nagłówek reprezentowany przez element h1
. Wspomniany element h1
reprezentuje tytuł dla treści reprezentowanej przez zawartość wspomnianego elementu article
. Wspomnianym tytułem w tym wypadku jest tytuł: Mój ulubiony kolor
.
Nagłówek elementu HTML jest swego rodzaju wstępem do treści reprezentowanej przez pozostałą zawartość tegoż elementu HTML.
W sytuacji gdy chcemy, aby nagłówek interesującego nas elementu HTML nie składał się wyłącznie z elementu HTML należącego do kategorii nagłówek zawartości lub w sytuacji gdy chcemy wskazać przeglądarce internetowej, że to właśnie te, a nie inne elementy HTML stanowią nagłówek interesującego nas elementu HTML, wtedy możemy skorzystać z elementu header.
Przykład:
<article>
<header><!-- POCZĄTEK OBSZARU NAGŁÓWKA SEKCJI ZAWARTOŚCI TYPU ARTICLE -->
<p>Opublikowano: 2016-01-01</p>
<h1>Mój ulubiony kolor</h1>
<p>Autor: Jan Kowalski</p>
</header><!-- KONIEC OBSZARU NAGŁÓWKA SEKCJI ZAWARTOŚCI TYPU ARTICLE -->
<p>
Moim ulubionym kolorem jest kolor błękitny.
</p>
<p>
Ponieważ błękitny to kolor nieba.
</p>
</article>
Od tej pory nasz przykładowy kod HTML zawiera dodatkową informację dla przeglądarki internetowej o tym, że nagłówek naszego przykładowego elementu article
tworzony jest przez zawartość pierwszego elementu p
, zawartość pierwszego elementu h1
oraz zawartość drugiego elementu p
elementu header
występującego w zawartości naszego przykładowego elementu article
.