Tabelle

Le tabelle, introdotte dalla versione 3.2 dell'HTML, sono un potente strumento che consente l'organizzazione dei dati nelle pagine Web.
I tag fondamentali per la creazione di una tabella sono:

<TABLE> e </TABLE> per inizio e fine tabella
<TR> e </TR> per l'apertura e la chiusura di una riga
<TD> e </TD> per l'apertura e la chiusura di una cella nella riga.

I tag di chiusura delle righe e delle celle, che erano indispensabili nelle prime definizioni delle tabelle, sono ora diventati opzionali. Per essere però sicuri che tutti i browser interpretino correttamente la formattazione della tabella, è consigliabile continuare ad utilizzarli.
Nei tag fondamentali illustrati sopra possono essere specificati una serie di attributi che, combinati con la possibilità di inserire tabelle all'interno delle celle, consentono la realizzazione di qualunque tipo di griglia e quindi di posizionare a piacimento i testi e le immagini nella pagina Web.
Ecco un semplice esempio di tabella di due righe e due colonne:

<TABLE>
<TR>
<TD>(1,1)</TD>
<TD>(1,2)</TD>
</TR>
<TR>
<TD>(2,1)</TD>
<TD>(2,2)</TD>
</TR>
</TABLE>

- Netscape: Guida HTML _ X

(1,1) (1,2)

(2,1) (2,2)

Titolo e intestazioni

L'HTML fornisce inoltre la possibilità di inserire il titolo della tabella e l'intestazione delle righe e delle colonne.
Il tag per il titolo è <CAPTION> e deve essere inserito subito dopo il tag <TABLE>.
Il tag per le intestazioni è <TH> e deve essere inserito:
nella prima riga se si vuole dare un'intestazione alle colonne;
prima del primo elemento di ogni riga se si vogliono intestare le righe.
Esempi:

<TABLE>
<CAPTION>
Titolo: Intestazione colonne
</CAPTION>
<TR>
<TH>Prima colonna</TH>
<TH>Seconda colonna</TH>
</TR>
<TR>
<TD>(1,1)</TD>
<TD>(1,2)</TD>
</TR>
<TR>
<TD>(2,1)</TD>
<TD>(2,2)</TD>
</TR>
</TABLE>

- Netscape: Guida HTML _ X

Titolo: Intestazione colonne
Prima colonna Seconda colonna
(1,1) (1,2)

(2,1) (2,2)

<TABLE>
<CAPTION>
Titolo: Intestazione righe
</CAPTION>
<TR>
<TH>Prima riga</TH>
<TD>(1,1)</TD>
<TD>(1,2)</TD>
</TR>
<TR>
<TH>Seconda riga</TH>
<TD>(2,1)</TD>
<TD>(2,2)</TD>
</TR>
</TABLE>

- Netscape: Guida HTML _ X

Titolo: Intestazione righe
Prima riga (1,1) (1,2)

Seconda riga (2,1) (2,2)

Formattazione delle tabelle

L'HTML definisce una serie di attributi che, specificati nei tag fondamentali per la creazione delle tabelle, consentono di impostare:

Ecco ad esempio come si possono sfruttare questi attributi per creare un menù per la navigazione.

Bordi	Spazio tra celle	Spazio nelle celle	Larghezza tabella
Larghezza celle	Allineamenti	Colori	Celle multiple