Il tag label rappresenta una caption all'interno della UI, che può essere associata ad un tag all'interno di una form.
Il tag viene inserito all'interno della pagina in due modi differenti:
- può fungere da contitore del tag: il primo elemento di tipo form verrà preso come controllo a cui fa riferimento;
- può non contenere il tag di tipo form e riferirsi al tag attraverso l'attributo for.
Se associati a controlli come le checkbox, il testo inserito diventerà anche parte dell'area di attivazione, migliorando la UX dell'utente, che potrà premere anche sul testo per interagire con il controllo:
<label title="scegli l'Italia"> <input type="checkbox" name="country" /> Italia </label>
Per questo motivo, va evitato l'utilizzo di controlli di tipo interattivo (come i link) all'interno del tag label.
Inoltre, grazie all'utilizzo dell'attributo title, l'effetto prodotto dai browser è quello di mostrare un tooltip in corrispondenza del campo che andiamo a riempire, migliorando la UX.
Ecco anche un esempio di utilizzo esternamente al tag a cui si riferisce, con l'attributo for:
<label for="name" title="Inserisci il nome">Nome:</label> <input type="text" name="name" id="name" />
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Eseguire una query su SQL Azure tramite un workflow di GitHub
Inizializzare i container in Azure Container Apps
Migliorare i tempi di risposta di GPT tramite lo streaming endpoint in ASP.NET Core
Aggiungere interattività lato server in Blazor 8
Testare l'invio dei messaggi con Event Hubs Data Explorer
Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
Creare un'applicazione React e configurare Tailwind CSS
Utilizzare un numero per gestire la concorrenza ottimistica con SQL Server ed Entity Framework
Usare una container image come runner di GitHub Actions
Sviluppare un'interfaccia utente in React con Tailwind CSS e Preline UI
Ottimizzare il mapping di liste di tipi semplici con Entity Framework Core
Criptare la comunicazione con mTLS in Azure Container Apps