Element label

Element label definuje označenie pre vstupné pole typu input, textarea, select a tak ďalej.

Označenie je priradené k konkrétnemu vstupnému poliu pomocou atribútu for. V ňom treba uviesť hodnotu atribútu id vstupného poľa, ku ktorému je označenie priradené. Označenie je tiež priradené k elementu, ak sa tento element umiestni dovnútra elementu label. V tomto prípade nie je potrebné uvádzať atribút for. Pozrite si príklady pre lepšie pochopenie.

Kliknutím na označenie sa priradené začiarkavacie políčka alebo prepínače zmenia svoj stav z začiarknutého na nezačiarknuté a naopak. Označenie je v tomto prípade určené pre pohodlie: je ťažké zasiahnuť kurzorom malé prvky formulára, kým dlhé označenie s textom je oveľa jednoduchšie.

Priradené textové vstupné pole typu input a textarea získa vstupný focus. Focus - to je keď kurzor bliká vo vstupnom poli, v tomto prípade, ak budete niečo písať na klávesnici - text sa dostane do tohto poľa (pozri pseudotriedu focus pre pokročilé pochopenie focusu).

Označenie label možno použiť pre simuláciu začiarkavacieho políčka alebo prepínača. Je to potrebné pre vytvorenie checkbox alebo radio s vlastným dizajnom (čo je v CSS zakázané, ale pomocou chytrých trikov možné).

Atribúty

Atribút	Popis
for	V tomto atribúte treba uviesť hodnotu atribútu id toho vstupného poľa, ku ktorému je priradené označenie label.
accesskey	Nastavuje hot key, pomocou ktorej možno prejsť k priradenému označeniu (cez atribút for) elementu formulára. Podrobnejšie pozri atribút accesskey.

Príklad . Začiarkavacie políčko

Priraďme k začiarkavaciemu políčku checkbox označenie pomocou atribútu for. Klikajte na označenie a uvidíte zmenu stavu začiarkavacieho políčka z začiarknutého na nezačiarknuté a naopak:

:

Príklad . Vnútri label

A teraz nepriraďme označenie cez atribút for, ale vložme elementy priamo do elementu label, v tomto prípade kliknutím na text label tiež aktivujeme element:

:

Príklad . Textové vstupné pole

Priraďme elementu input označenie pomocou atribútu for. Kliknutie na označenie povedie k získaniu focusu vstupným poľom. Pri tom obsah poľa (pridaný pomocou atribútu value) sa označí. Ak začnete niečo písať na klávesnici - tento text sa zmaže. Zbaviť sa označenia, bez vymazania textu, je možné kliknutím myšou do vstupného poľa: focus pri tom nezmizne, ale označenie zmizne:

:

Pozri tiež