Sformułowanie, że znaczniki HTML zwykle występują w parach, oznacza, że większość elementów w kodzie HTML rozpoczyna się znacznikiem otwierającym i kończy znacznikiem zamykającym, pomiędzy którymi umieszcza się właściwą treść lub inne znaczniki.
Czym są znaczniki HTML?
Znaczniki HTML (ang. HTML tags) są specjalnymi instrukcjami w języku HTML, które informują przeglądarkę, jak należy wyświetlić i zorganizować zawartość strony internetowej. Każdy znacznik opisuje wybrany fragment struktury, na przykład tekst, obraz, nagłówek czy odnośnik.
Jak wygląda para znaczników?
Para znaczników składa się z –
- Znacznika otwierającego – np.
<p>; - Treści objętej znacznikiem;
- Znacznika zamykającego – np.
</p>.
Znacznik zamykający zawsze rozpoczyna się od ukośnika (/), np. </p>. Elementy te stanowią logiczną całość, ograniczając i definiując fragment kodu, który do nich należy.
Przykład:
<p>To jest przykładowy akapit tekstu.</p>
Powyżej <p> to znacznik otwierający akapit, a </p> zamyka ten sam akapit.
Dlaczego stosuje się pary znaczników?
- Wyraźna struktura – para znaczników jasno określa początek i koniec danego elementu na stronie (np. paragrafu, nagłówka, sekcji);
- Możliwość zagnieżdżania – takie podejście umożliwia umieszczanie znaczników wewnątrz innych znaczników, budując hierarchiczną strukturę (np. lista w artykule, obraz w akapicie);
- Czytelność i poprawność kodu – stosowanie par eliminuje niejednoznaczności, pozwala zachować prawidłową strukturę dokumentu.
Przykłady zastosowań par znaczników
Oto kilka najczęściej wykorzystywanych par znaczników HTML:
Akapit tekstu
<p>To jest przykładowy paragraf.</p>
Tworzy pojedynczy akapit tekstu.
Nagłówki
<h1>Główny tytuł strony</h1>
<h2>Podtytuł sekcji</h2>
Znaczniki <h1>…<h6> oznaczają nagłówki różnego poziomu – od najważniejszego do najmniej ważnego.
Listy nieuporządkowane
<ul>
<li>Pierwszy element</li>
<li>Drugi element</li>
</ul>
Para <ul>...</ul> otacza całą listę, a każda pozycja otoczona jest parą <li>...</li>.
Wyróżnienie fragmentu tekstu
<p>To jest <strong>ważny</strong> fragment tekstu.</p>
Znacznik <strong>...</strong> służy do wyróżnienia ważnych fragmentów.
Hiperłącze
<a href="https://przyklad.pl">Odwiedź stronę</a>
Znacznik <a>...</a> definiuje odnośnik, atrybut href wskazuje adres przejścia.
Wyjątki – znaczniki pojedyncze (samozamykające)
Warto wspomnieć, że nie wszystkie znaczniki HTML występują w parach. Niektóre, tzw. znaczniki samotne lub samozamykające (np. <br> do łamania linii, <img> do osadzania obrazów), nie posiadają zamykającej wersji:
<img src="obrazek.jpg" alt="Opis obrazka">
<br>
Ich działanie nie wymaga określania obszaru działań na stronie.
Podsumowanie
Występowanie znaczników w parach zapewnia precyzyjne zdefiniowanie zakresu działania danego elementu na stronie, wpływa na poprawność i przejrzystość kodu oraz umożliwia zorganizowaną budowę nawet bardzo rozbudowanych struktur HTML. Stosowanie tej zasady jest fundamentalne dla każdego, kto tworzy strony internetowe i chce zadbać o ich prawidłowe wyświetlanie oraz działanie.