Le tabelle
Tabelle: struttura di base
Le tabelle rappresentano uno degli strumenti più utilizzati e potenti nella formattazione dei documenti HTML.
Gli elementi fondamentali per definire la struttura di una tabella sono:
- TABLE, che indica l' inizio e la fine di una tabella, caratterizzato dai tag <TABLE> e </TABLE>;
- TR, che indica l'inizio di una nuova riga, caratterizzato dai tag <TR> e </TR>;
- TD, che indica l'inizio di una nuova cella all'interno di una riga, caratterizzato dai tag <TD> e </TD>;
Esempio :
<HTML>
<HEAD>
<TITLE>esempio</TITLE>
</HEAD>
<BODY>
<TABLE>
<TR>
<TD>A</TD>
<TD>B</TD>
<TD>C</TD>
</TR>
<TR>
<TD>D</TD>
<TD>E</TD>
<TD>F</TD>
</TR>
</TABLE>
</BODY>
</HTML>
Creare una tabella a larghezza fissa o dinamica
Per creare una tabella a larghezza fissa bisognerà imporre altezza e larghezza in pixel, aggiungendo attributi width e height.
Come per le immagini, border ci serve a determinare il bordo della nostra tabella,
se inserirlo, se diminuirlo, aumentarlo etc...
Di default il bordo è pari
a 1.
Se ivece lo impostiamo con
valore = 0, il bordo non verrà visualizzato.
Esempio:
<TABLE width: "152" height: "86" border:"1">
<TR>
<TD>A</TD>
<TD>B</TD>
<TD>C</TD>
</TR>
<TR>
<TD>D</TD>
<TD>
E</TD>
<TD>
F</TD>
</TR>
</TABLE>
.............
Mentre per creare una tabella a larghezza dinamica bisognera' imporre altezza e larghezza in %
Esempio:
<TABLE width: "152%" height: "86%" border:"1">
<TR>
<TD>A</TD>
<TD>B</TD>
<TD>C</TD>
</TR>
<TR>
<TD>D</TD>
<TD>
E</TD>
<TD>
F</TD>
</TR>
</TABLE>
.............
Di solito la larghezza e l'altezza globali della tabella sono espresse nel tag <table>,
mentre la larghezza delle varie celle viene espressa nei <td> della prima riga.
L'altezza in percentuale non sempre
è visualizzata correttamente da tutti i browser.
Per dare ordine alle nostre tabelle sono stati introdotti questi attributi opzionali:
- <caption> è l?intestazione, il titolo
-
<thead> è l'intestazione, la parte iniziale della tabella, quella che contiene ad esempio indicazioni sul contenuto delle celle
-
<tfoot> è il piede, la conclusione della tabella
-
<tbody> è il corpo, la parte centrale con il contenuto vero e proprio della tabella