Label HTML

Label HTML

<label>

Do opisu elementów <input> używamy specjalnie przeznaczonego do tego elementu <label> (ang. etykieta). Element ten wypełniamy opisem danego pola.

<label>Cena</label>

Etykietkę już mamy, następnie musimy ją przypisać do danego pola <input>. Przypisania dokonujemy poprzez atrybut for (ang. dla). Żeby prawidłowo połączyć element z jego etykietą, atrybut for wypełniamy nazwą atrybutu id danego elementu.

<label for="price">Cena</label>
<input type="text" id="price">

Naciśnięcie na etykietę powoduje automatycznie przejście do elementu <input>.

Hmm.., dodawanie id do każdego pola, które chcemy opisać, musi być wykańczające. Nie ma prostszego sposobu? Pewnie, że jest. Proces ten na szczęście możemy uprościć i pozbyć się zarówno atrybutu for oraz id. Wystarczy zagnieździć element <input> wewnątrz elementu <label>. Sprawdźmy jak tego dokonać.

<label>Cena <input type="text"></label>

Rzeczywiście prostsze, i mniej tych wszystkich atrybutów. Od tej pory będziemy korzystać z tego uproszczonego zapisu.