HTML.itHTML.it


 Un po' d’ordine: raggruppare i moduli



Per la loro natura di "raccoglitori di informazioni", i moduli tendono a ingigantirsi e diventare lunghissimi. Per questo, con l’HTML 4 sono stati introdotti dei tag per fare un po’ d’ordine all’interno dei form.

Grazie al tag <fieldset> possiamo creare delle macro-aree all’interno dei form, e grazie al tag <legend>, possiamo indicare il nome di ciascuna macro-area.

Poniamo ad esempio di dover raccogliere i dati di un utente, raccogliendo dati anagrafici, residenza, domicilio e reperibilità sul lavoro.

Possiamo farlo con la seguente sintassi:

<fieldset>
     <legend>Dati anagrafici</legend>
     <br><br><br>
</fieldset>

<fieldset>
     <legend>Residenza</legend>
     <br><br><br>
</fieldset>

eccetera

che dà:

     Dati anagrafici     


     Residenza     


come si può vedere vengono creati dei riquadri con un indicazione del tipo di contenuto.

Un altro tag particolarmente utile - si può utilizzare con ogni tipo di campo che vedremo d’ora in poi - è il tag <label>, che permette di indicare un’etichetta per il nome del campo.

Ad esempio:

<fieldset>
    <legend>Dati anagrafici</legend>
    <label>Anno di nascita: <input type="text"></label>
</fieldset>

che dà:

    Dati anagrafici    

oppure (cambiando la posizione del testo):

<fieldset>
    <legend>Dati anagrafici</legend>
     <label><input type="text">: anno di nascita</label>
</fieldset>

che dà:

    Dati anagrafici     

Come si può vedere il campo su cui si vogliono dare delle indicazioni deve essere compreso all’interno del tag label stesso.

    Torna a inizio pagina