Riepilogo - Moduli #2
Fa parte della sezione Fondamenti del percorso HTML di Coddy. Lezione 47 di 60.
Sfida
FacileCreiamo un semplice modulo di registrazione, proprio come quello nell’immagine qui sotto!

Ecco cosa includere:
- Un tag
<form>per racchiudere tutto. - Un campo Username con un’etichetta e un input di testo. L’etichetta dovrebbe riportare
"Username:"e usare for="username". L’input dovrebbe avereid="username",name="username",type="text"e il segnaposto"Enter your username". - Un campo Email con un’etichetta e un input email. L’etichetta dovrebbe riportare
"Email:"e usarefor="email". L’input dovrebbe avereid="email",name="email",type="email" e il segnaposto"Enter your email". - Un campo Password con un’etichetta e un input password. L’etichetta dovrebbe riportare
"Password:"e usarefor="userpassword". L’input dovrebbe avereid="userpassword",name="userpassword",type="password"e il segnaposto"Enter your password". - Un gruppo di pulsanti di opzione che permetta agli utenti di selezionare il proprio tipo:
"Student"o"Teacher". Aggiungi un paragrafo o un’intestazione che riporti"User Type:"sopra i pulsanti di opzione. Il pulsante di opzione"Student"dovrebbe avereid="student",name="usertype",value="student"e un’etichetta che riporti"Student". Il pulsante di opzione"Teacher"dovrebbe avereid="teacher",name="usertype",value="teacher"e un’etichetta che riporti"Teacher". Ricorda: entrambi i pulsanti di opzione devono avere lo stesso attributo name ("usertype") in modo che se ne possa selezionare solo uno alla volta. - Un gruppo di caselle di controllo che permetta agli utenti di scegliere i propri interessi:
"Sports","Music"e"Technology". Aggiungi un paragrafo o un’intestazione che riporti"Interests:"sopra le caselle di controllo. La casella di controllo"Sports"dovrebbe avereid="sports",name="interests",value="sports"e un’etichetta che riporti"Sports". La casella di controllo"Music"dovrebbe avereid="music",name="interests",value="music"e un’etichetta che riporti"Music". La casella di controllo"Technology"dovrebbe avereid="technology",name="interests",value="technology"e un’etichetta che riporti"Technology". Ricorda: tutte le caselle di controllo dovrebbero avere lo stesso attributo name ("interests") poiché fanno parte dello stesso gruppo. - Un pulsante Sign Up e un pulsante Clear alla fine del modulo. Il pulsante Sign Up dovrebbe avere
type="submit"e il pulsante Clear dovrebbe averetype="reset". Il pulsante Sign Up dovrebbe mostrare il testo "Sign Up" e il pulsante Clear dovrebbe mostrare il testo “Clear”.
Assicurati di includere etichette e titoli appropriati per offrire un’esperienza intuitiva!
Ricorda, gli input dovrebbero includere questi attributi importanti:
type,id,nameevalue.
Provalo tu
<!DOCTYPE html>
<html>
<body>
<!-- Scrivi il codice qui -->
</body>
</html>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 intestazione2Testo 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 intestazione9Moduli e input - Parte 2
Pulsanti di opzioneCaselle di controlloMenu a discesaPulsantiPulsanti nei moduliRiepilogo - Moduli #1Riepilogo - Moduli #2Esercitati da solo: Playground Web