2009-07-07 9 views
11

W3Schools hanno da dire su labels:Un'etichetta può riferirsi solo a elementi di input?

Il <label> tag definisce un'etichetta per un elementoingresso. [enfasi mia]

Questo significa che il seguente codice HTML non è valido?

<html> 
    <body> 
     <label for="x">Label</label> 
     <hr> 
     <div id="q" contentEditable="true">Hello</div> 
     <hr> 
     <div id="x" contentEditable="true">World</div> 
    </body> 
</html> 

Sia Chrome e IE8 dare attenzione a World quando Label si fa clic, Firefox non è così. Quale è corretto?

risposta

8

Secondo il W3C essa si applica ai controlli del form, e controlli dei moduli sono defined as:

  • Bottoni
  • Checkboxes
  • Radio pulsanti
  • Menu
  • di immissione del testo
  • File selezionare
  • controlli nascosti
  • tag object

Così Firefox è tecnicamente giusto, anche se mi piacerebbe difficilmente lo considerano "rottura" se un browser non ha limitato a quegli elementi.

+0

Gli elementi semantici sono un primo grande passo per il web sul web - quindi è generalmente una buona pratica attenersi alle specifiche per gli screen reader e così via. – Olga

5

Le specifiche HTML dice, circa label 's "per" l'attributo, "Quando è presente, il valore di questo attributo deve essere uguale al valore dell'attributo id di qualche altro controllo nello stesso documento. Quando assente, l'etichetta definita è associata al contenuto dell'elemento."

Quindi i riferimenti di identificazione in "for" dovrebbero essere quelli di un controllo. Cos'è un controllo? Le specifiche in pratica dicono che qualsiasi input è un controllo, come lo è button, select o object. Quindi Firefox è tecnicamente corretto: uno div non è un controllo.

+0

Continui a dire "id", non intendi "per"? – Motti

+0

Sì, hai ragione. Modificato per risolvere. –

Problemi correlati