Oznaka label

Oznaka label določa oznako za vnosno polje tipa input, textarea, select in tako naprej.

Oznaka je povezana z določenim vnosnim poljem z uporabo atributa for. V njem je treba navesti vrednost atributa id vnosnega polja, s katerim je oznaka povezana. Prav tako je oznaka povezana z elementom, če je ta element postavljen znotraj oznake label. V tem primeru atributa for ni treba navesti. Za boljše razumevanje si oglejte primere.

Ob kliku na oznako bodo z njo povezana potrditvena polja ali radio gumbi spremenili svoje stanje iz označenega v neoznačeno in obratno. Oznaka je v tem primeru namenjena udobju: v majhne elemente obrazca je težko zadeti s kazalcem, v dolgo oznako z besedilom pa je veliko lažje.

Z oznako povezano besedilno vnosno polje tipa input in textarea bo prejelo vnosno fokus. Fokus pomeni, da kazalec utripa v vnosnem polju, v tem primeru, če boste kaj tipkali na tipkovnici - besedilo bo prišlo v to polje (glej psevdo razred focus za napredno razumevanje fokusa).

Oznako label je mogoče uporabiti za posnemanje potrditvenega polja ali radio gumba. To je potrebno, da naredimo checkbox ali radio z lastno zasnovo (kar v CSS ni dovoljeno, vendar je z zvitejšimi prijemi mogoče).

Atributi

Atribut	Opis
for	V tem atributu je treba navesti vrednost atributa id tistega vnosnega polja, s katerim je povezana oznaka label.
accesskey	Določa bližnjico, s katero se je mogoče premakniti k elementu obrazca, povezanega z oznako (prek atributa for). Za več podrobnosti glej atribut accesskey.

Primer . Potrditveno polje

Povežimo potrditveno polje checkbox z oznako z uporabo atributa for. Kliknite na oznako in videli boste spremembo stanja potrditvenega polja iz označenega v neoznačeno in obratno:

:

Primer . Znotraj label

Zdaj pa ne povežimo oznake prek atributa for, temveč bomo elemente postavili neposredno znotraj oznake label, v tem primeru bo klik na besedilo label prav tako aktiviral element:

:

Primer . Besedilno vnosno polje

Povežimo oznako z oznako input z uporabo atributa for. Klik na oznako bo povzročil, da bo vnosno polje prejelo fokus. Pri tem bo besedilo, ki je vsebovano v polju (dodali ga bomo z atributom value) izbrano. Če začnete karkoli tipkati na tipkovnici - to besedilo bo izbrisano. Lahko se znebite izbire, ne da bi pri tem izbrisali besedilo, tako da kliknete z miško na vnosno polje: fokus pri tem ne bo izginil, izbira pa bo prenehala:

:

Glejte tudi