9. Liste
Al fine di strutturare i dati in maniera più organizzata, con particolar riguardo per gli elenchi e le liste, L'HTML prevede delle
istruzioni apposite.
Fondamentamente le liste prevedono dei tag iniziali e finali che delimitano il testo facente parte della lista, e dei tag intermedi che
identificano un elemendo della stessa.
Le liste possono essere nidificate, cioè inserite una dentro l'altra, ed il browser si occuperà di allinearle nella maniera corretta.
I tipi di lista/elenco che possono essere utilizzati sono i seguenti:
- <OL> ... </OL> per un elenco ordinato e numerato, tipicamente rientrato e con una spaziatura aggiuntiva tra i
paragrafi (come l'indice visualizzato nel frame a sinistra);
- <UL> ... </UL> per un elenco non ordinato. Invece dei numeri le voci prevedono dei punti elenco (come il presente elenco);
- <MENU> ... </MENU> per un elenco di brevi voci. In genere occupa
una riga e viene visualizzato in modo più compatto dell'UL:
- <DIR> ... </DIR> per visualizzare un tipico elenco di nomi di file. In genere vengono visualizzati su colonne
multiple.
Ogni elemento della lista è considerato un paragrafo a se stante e deve iniziare con il tag <LI> che non necessita del tag di chiusura
</LI> che non esiste.
Come esempio, per generare una lista, la struttura è la seguente:
|
<HTML>
<HEAD>
</HEAD>
<BODY>
<H1>Indice della pubblicazione</H1>
<UL>
<LI>Capitolo 1
<LI>Capitolo 2
<UL>
<LI>Sezione 1
<LI>Sezione 2
</UL>
<LI>Capitolo 3
</UL>
</BODY>
</HTML>
|
|
L'esempio mostra due liste nidificate e, si nota che il browser si occupa di gestire il tutto
senza che l'utente debba dettagliare troppo quello che desidera in uscita. Come già detto in precedenza, il browser utilizza due diversi tipi di carattere per identificare diversi livelli di
nidificazione della lista.
Chissà che succederebbe se la lista, invece di esser <UL> fosse stata <OL>?
L'effetto sarebbe quello visibile a questo link.
E' anche possibile cambiare le "intestazioni" degli elementi delle liste. Per le liste ordinate,
esiste l'attributo "TYPE" che serve per indicare il tipo di indicizzazione che si vuole avere sulla lista. Ad esempio, il comando <OL TYPE="a">, creerà una lista ordinata, utilizzando le
lettere minuscole come indice. Gli altri valori possibili sono: "A" per usare lettere maiuscole;
"I" per usare la numerazione romana maiuscola; "i" per i numeri romani minuscoli; "1" (default) per utilizzare i numeri. Per le liste non ordinate, invece, i valori possibili
sono="DISC" per dei cerchi pieni; "CIRCLE" per dei cerchi vuoti; "SQUARE" per dei quadratini (anche se, ripetiamo, non è detto che la resa sia esattamente quella voluta).
Per le liste ordinate, infine, esiste un ulteriore attributo, "START", per indicare il punto da cui
far partire la numerazione: ad esempio <OL TYPE="A" START="5"> farà partire la numerazione dalla lettera "E". Naturalmente tale attributo non ha alcuna funzionalità
nell'ambito delle liste non ordinate.
Definition List
Esiste un secondo tipo di lista chiamato elenco di definizione, o glossario. Si tratta di un
elenco di paragrafi, ognuno dei quali è dotato di una breve intestazione e da un contenuto. E' utili per includere un insieme di nomi, ognuno accompagnato dalla sua definizione.
Un elenco di definizione è chiuso tra le istruzioni <DL> e </DL>. Ogni voce di definizione è
composta di due parti: <DT> per l'intestazione, e <DD> per la spiegazione. Per verificarne subito la resa provate ad inserire il seguente script:
|
<HTML>
<HEAD> <TITLE>Prova di un Dizionario d'Informatica </TITLE></HEAD>
<BODY>
<FONT SIZE=5> Dizionario d'Informatica</FONT><BR>
<HR>
<DL>
<DT><FONT SIZE=4>Abaco
</FONT><DD>Tavoletta o pallottoliere che veniva usato per le operazioni ...
<DT><FONT SIZE=4>Abortire </FONT><DD>Verbo usato per indicare la
terminazione forzata di un ...
<DT><FONT SIZE=4>Accesso casuale
</FONT><DD>Questo termine indica uno dei due possibili metodi ...
<DT><FONT SIZE=4>Accesso diretto alla memoria </FONT><DD>V. DMA
<DT><FONT SIZE=4>Accesso sequenziale
</FONT><DD>E' uno dei due possibili metodi per il reperimento ...
<DT><FONT SIZE=4>Accoppiatore acustico
</FONT><DD>Apparato che consente l'uso di un normale telefono...
<DT> <DD><FONT SIZE=4>...</FONT>
</DL>
</BODY>
</HTML>
|
|
Come ultima nota vogliamo riportare un attributo del comando <DL> che permette di ridurre
lo spazio bianco tra le righe e le indentazioni negli elenchi di definizioni: <DL COMPACT>.
   
|
