Taggen label

Taggen label setter en merkelapp for et inntastingsfelt av typen input, textarea, select og så videre.

Merkelappen kobles til et spesifikt inntastingsfelt ved hjelp av attributten for. I den skal man oppgi verdien av attributten id til inntastingsfeltet som merkelappen er koblet til. Også kan merkelappen kobles til elementet hvis dette elementet plasseres inne i taggen label. I dette tilfellet trenger man ikke å oppgi attributten for. Se eksempler for bedre forståelse.

Ved å klikke på merkelappen vil de tilknyttede avkrysningsboksene eller radioknappene endre tilstanden sin fra avmerket til ikke avmerket og omvendt. Merkelappen er i dette tilfellet til for enkelthets skyld: det er vanskelig å treffe små skjemaelementer med musepekeren, men i en lang merkelapp med tekst - er det mye enklere.

Det tilknyttede tekstinntastingsfeltet av typen input og textarea vil få inntastingsfokus. Fokus - er når markøren blinker i inntastingsfeltet, i dette tilfellet, hvis du skriver noe på tastaturet - vil teksten havne i dette feltet (se pseudoklassen focus for avansert forståelse av fokus).

Merkelappen label kan brukes til å etterligne avkrysningsboks eller radioknapp. Dette er nødvendig for å lage checkbox eller radio med eget design (noe som er forbudt i CSS, men med bruk av smarte teknikker er mulig).

Attributter

Attributt	Beskrivelse
for	I denne attributten skal man oppgi verdien av attributten id til det inntastingsfeltet som merkelappen label er koblet til.
accesskey	Setter en hurtigtast, som kan brukes til å gå til det elementet i skjemaet som er koblet til merkelappen (gjennom attributten for). Se mer detaljert i attributten accesskey.

Eksempel . Avkrysningsboks

La oss koble en merkelapp til en avkrysningsboks checkbox ved hjelp av attributten for. Trykk på merkelappen og du vil se endringen i tilstand på avkrysningsboksen fra avmerket til ikke avmerket og omvendt:

:

Eksempel . Inne i label

La oss nå ikke koble merkelappen gjennom attributten for, men plassere elementene rett inni taggen label, i dette tilfellet vil et klikk på teksten i label også aktivere elementet:

:

Eksempel . Tekstinntastingsfelt

La oss koble en merkelapp til taggen input ved hjelp av attributten for. Et klikk på merkelappen vil føre til at inntastingsfeltet får fokus. Samtidig vil teksten som finnes i feltet (vi legger den til ved hjelp av attributten value) blitt markert. Hvis du begynner å skrive noe på tastaturet - vil denne teksten bli overskrevet. For å bli kvitt markeringen uten å slette teksten, kan man klikke med musepekeren på inntastingsfeltet: fokuset forsvinner ikke, men markeringen forsvinner:

:

Se også