Etichette per gli input
Fa parte della sezione Fondamenti del percorso HTML di Coddy. Lezione 39 di 60.
Non è sempre molto chiaro a cosa serva un input senza un'etichetta. Un'etichetta fornisce agli utenti un'indicazione visiva chiara sul tipo di input previsto in quel campo. Le etichette si creano usando il tag <label>.
Ecco la sintassi di base:
<label for="field">Label text</label>
<input type="text" id="field"><label>: Il tag che crea l’etichetta.
for: Un collegamento tra l’etichetta e un campo del modulo. Il valore difordovrebbe corrispondere all’iddel campo del modulo.
- Testo dell'etichetta: il testo che descrive a cosa serve il campo del modulo.
<input>: Il campo del modulo a cui si riferisce l’etichetta.
id: L'identificatore univoco del campo del modulo, che corrisponde all'attributofornell'etichetta.
Sfida
FacileAggiungi i seguenti tag all'interno del tag <form>:
- Un
<label>con il testo 'First Name:' e l'attributoforimpostato su 'firstname'. - Un campo
<input>contype="text". - Il campo
<input>deve avere unidche corrisponde all'attributofordell'etichetta.
Provalo tu
<!DOCTYPE html>
<html>
<body>
<form>
<!-- Scrivi il codice qui -->
</form>
</body>
</html>
Mettiti alla provaQuesta lezione include un breve quiz. Inizia la lezione per rispondere e tenere traccia dei tuoi progressi.
Tutte le lezioni di Fondamenti
1Fondamenti di HTML
Che cos’è HTML?Struttura di base di un documento HTMLTag ed elementiAnnidamento e tag di chiusuraCommenti in HTML7Pagina del profilo personale
Panoramica del progettoSezione intestazione
Immagine del profiloSezione Chi sonoLink ai social2Testo e formattazione
IntestazioniParagrafiInterruzioni di rigaTesto in grassetto e corsivoAncora grassetto e corsivoRiepilogo - formattazione5Aggiungere contenuti
Attributi HTMLCollegamentiCollegamenti a nuove pagineImmaginiAttributi delle immagini8Moduli e campi di input - Parte 1
Nozioni di base sui moduliCampi di testoAttributi degli inputCampo passwordEtichette per gli inputRiepilogo - modulo di base11Pagina di registrazione all'evento
Panoramica del progettoSezione intestazioneSezione dettagli dell'eventoModulo di registrazioneSezione piè di paginaEsercitati da solo: Playground Web