Strona główna >WWW >Leksykon HTML – elementy i atrybuty >hr – zmiana tematu

hr – zmiana tematu

<hr>

Przerwa tematyczna: miejsce, w którym tekst przechodzi do innego tematu, zmiana sceny w opowiadaniu, oddzielenie grup w menu. Przeglądarka rysuje ją jako poziomą linię, ale jej znaczenie to „przerwa”, nie „linia” – linia tylko dla ozdoby należy do CSS (border).

Domyślne wyświetlanie: display: block
Znacznik zamykający: brak – element pusty (void element) bez zawartości i bez znacznika zamykającego
Zawartość: nic
Gdzie może wystąpić: wszędzie, gdzie dozwolona jest treść przepływu; w select między opcjami
Interfejs DOM: HTMLHRElement

Atrybuty

Tylko atrybuty globalne. Przestarzałe size, width, color, noshade i align zastępuje CSS.

Przykłady

Przerwa między dwoma tematami i linia ostylowana w CSS:

<p>To wszystko o pieczeniu chleba.</p>
<hr>
<p>A teraz coś o ciastach.</p>
<hr class="subtle">
<p>Smacznego.</p>

.subtle {
  height: 0;
  border: 0;
  border-top: 2px dashed #8bc34a;
}

Wynik

To wszystko o pieczeniu chleba.

A teraz coś o ciastach.

Smacznego.

Separator grup na liście wyboru:

<label for="pastry-choice">Wypieki</label>
<select id="pastry-choice">
  <option>Bułka</option>
  <option>Precel</option>
  <hr>
  <option>Chleb na zakwasie</option>
</select>

Dostępność

hr ma rolę separator – czytniki ekranu ogłaszają go jako separator. Dlatego nie używaj go tylko dla ozdoby; ozdobna linia to border w CSS.

Na co uważać

Domyślna linia to obramowanie 1px inset z odstępem 0.5em u góry i u dołu. Jej kolor zmienia więc border-color (albo border), a nie color.
Chrome obsługuje hr w select od wersji 119, Firefox od 122, a Safari od 17 (stan: październik 2026). Starsze przeglądarki go pomijają i opcje zostają bez separatora.
hr nie może stać w akapicie – akapit kończy się przed nim.

Obsługa w przeglądarkach

Baseline – szeroko dostępne: działa we wszystkich popularnych przeglądarkach, i to od dawna (najpóźniej od 2015 roku). Od wersji: Chrome 1, Firefox 1, Safari 3. Stan: październik 2026 (MDN browser-compat-data).

Zobacz też:
p – akapit
section – sekcja
select – lista wyboru
option – opcja listy