Elementy HTML

Podstawowym składnikiem języka HTML jest element. Większość elementów składa się ze znacznika otwierającego (ewentualnie z atrybutami), treści i znacznika zamykającego, np.:

<p class="akapit">To jest element reprezentujący akapit.</p>

Objaśnienie:

• <p class="akapit"> — znacznik otwierający <p> z atrybutem class o wartości akapit.
• To jest element… — treść elementu.
• </p> — znacznik zamykający.

W języku HTML wielkość liter w nazwach elementów i atrybutów nie ma znaczenia. Jest natomiast istotna w XHTML, w którym wszystkie nazwy znaczników i atrybutów muszą być zapisywane małymi literami. W HTML można je zapisywać dowolnie, ale W3C zaleca używanie małych liter.

Typy elementów HTML

W języku HTML istnieją trzy typy elementów: normalne, tekstowe i puste.

• Elementy normalne: składają się ze znacznika otwierającego z dowolną liczbą atrybutów, treści, która może obejmować tekst i inne elementy, oraz znacznika zamykającego w postaci nazwy elementu poprzedzonej ukośnikiem wstecznym, np.:

  <p class="akapit">Treść <span>akapitu</span></p>

• Elementy tekstowe: składają się ze znacznika otwierającego z dowolną liczbą atrybutów, treści, którą może być tylko zwykły tekst, oraz znacznika zamykającego w postaci nazwy elementu poprzedzonej ukośnikiem wstecznym, np.:

  <title>Tytuł strony</title>

• Elementy puste: składają się tylko ze znacznika początkowego, mogą mieć dowolną liczbę atrybutów oraz nie zawierają treści ani elementów potomnych. Przykładami są elementy <br>, <hr> oraz <link>.

Ponadto specyfikacja HTML5 opisuje różne modele treści elementów.

Aby w treści strony internetowej umieścić niektóre zarezerwowane znaki specjalne, w szczególności < i >, które są używane do budowy znaczników, należy stosować encje HTML.

Zagnieżdżanie elementów HTML

W elementach normalnych i tekstowych można zagnieżdżać inne elementy. Na tej koncepcji opiera się budowa stron internetowych, które składają się z różnych elementów zawierających inne elementy, które zawierają kolejne elementy itd. Poniżej znajduje się kilka przykładów zagnieżdżonych elementów HTML.

<p>Akapit zawierający <i>pochyły tekst</i></p>
<div>Sekcja zawierająca <p>akapit zawierający <i>pochyły tekst<i><p><div>
<article>Artykuł zawierający <div>sekcję zawierającą <p>akapit zawierający <i>pochyły tekst<i><p><div><article>

Komentarze HTML

Ważnym elementem dokumentu HTML są także komentarze. Nie są one wyświetlane przez przeglądarki internetowe w treści strony, ale każdy może je obejrzeć, podglądając kod źródłowy strony internetowej.

Początek komentarza HTML wyznaczają znaki <!--, a koniec – znaki -->.

Przykład:

<p>To jest akapit</p>
<!-- To jest komentarz, którego nie będzie widać w oknie przeglądarki -->

Komentarze można umieszczać w dowolnym miejscu dokumentu HTML oraz mogą one obejmować dowolną liczbę wierszy, np.:

<!-- To jest 
bardzo długi
komentarz HTML.
-->

<p> To jest akapit <!-- W tym akapicie jest komentarz -->, a to dalsza treść akapitu.</p> 

Należy uważać, aby komentarz nie „wyłączał” znaczników w sposób uszkadzający strukturę dokumentu, jak poniżej.

<p> To jest <strong>interesujący <!-- </strong> --> akapit.</p>

Element, znacznik czy tag

Potocznie elementy HTML często są nazywane znacznikami, ale specyfikacja precyzyjnie rozróżnia te dwa pojęcia. W standardzie HTML5.1 napisano:

„Znaczniki służą do oznaczania początku i końca elementów”.

Tę różnicę wyraźnie przedstawia poniższy schemat:

Z kolei tag to potoczna nazwa zarówno elementu, jak i znacznika używana w codziennych rozmowach. Zwykle jednak pod pojęciem tag rozumiany jest element HTML.