Le tabelle si creano attraverso il tag <table></table> all’interno del quale si devono indicare le righe, con il tag <tr></tr>, e le colonne, con il tag <td></td>.
Il tag <tr> significa “table row” mentre il tag <td> significa “table data” infatti quest’ultimo indica la “cella” della tabella piuttosto che la colonna.
Una struttura semplice potrebbe essere la seguente:
<table border=”1″>
<tr>
<td>Nome</td>
<td>Età</td>
</tr>
</table>
Che corrisponde a chiedere una tabella di bordo spesso 1, con una sola riga contenente due celle .
Il codice completo è il seguente:
<!– –>
<html><head><title></title></head>
<body>
<br>
<table border=”1″>
<tr>
<td>Nome</td>
<td>Età</td>
</tr>
</table>
</body>
</html>
In pratica nella riga definita tra i tag <tr></tr> si devono specificare tutte le celle con una struttura tipo:
<tr> <td>Nome</td> <td>Età</td> </tr>
Si possono aggiungere altre righe inserendo sempre la coppia di tag <tr></tr> e tra loro i tag <td></td> nel numero delle celle desiderate. Se nella seconda riga mettiamo una coppia <td></td> in più si avrà una cella in più.
Con questo programma aggiungiamo una prima riga di tipo “intestazione” e così il testo sarà di tipo bold. Per farlo al posto del tag <td> abbiamo usato <th> (table head).
Il risultato è questo.
Esercizio: create l’elenco degli alunni della vostra classe.