Una semplice tabella html

Creare una semplice tabella html 2x2 è molto utile percomprendere i rudimenti della sintassi da usare per"costruirne" di più complesse, ed infattiè quello che faremo per introdurrel'argomento.

Questo è un esempio di semplice tabella 2x2:

1	2
3	4

Sintassi tabella html

Diamo un'occhiata alla sintassi che ho usato per farequesta tabella html:

<table border=1><tr><td>1</td><td>2</td><tr><td>3</td><td>4</td></table>

  <TABLE>...</TABLE>

Come è facile intuire sono questi i TAGs basilari che specificano l'inizio e la fine di una tabella.
Come unico attributo di questa prima tabella vediamo il BORDER, al quale ho dato il valore 1 solo per renderla visibile, in seguito vedremo come inserirne altri che ci aiuteranno ad avere un maggior controllo della tabella stessa, lasciando poco o nulla al "caso".

  <TR>...</TR>

Sono i TAGs che specificano l'inizio e la fine di una singola riga.
A rigor di cronaca è bene puntualizzare che la chiusura del TAG non si è rivelata indispensabile, quindi possiamo tranquillamente omettere il </TR> ed affermare che il <TR> è il TAG che specifica l'inizio di una nuova riga.
Approfondendo ulteriormente possiamo dire che se intendiamo realizzare una tabella costituita da una serie di celle che giacciono sulla stessa riga possiamo anche omettere il <TR>.

  <TD>...</TD>

Dopo il <TABLE> e sua chiusura, sono i TAGs più importanti di una tabella in quanto tutto ciò che sarà visualizzato in una data cella deve necessariamente essere inserito tra questi due comandi.
Anche questo possiede dei comandi accessori che verranno trattati in seguito.

Quest'altra banale tabella 2x2 (identica allaprecedente, a parte il "contenuto" della primacella) ci fa vedere come...

...le celle si espandano automaticamente, se non specificato diversamente, in funzione del loro contenuto...	2
3	4

...solo le dimensioni della cella 4,infatti, sono rimaste invariate, in quantol'altezza della cella 2 è influenzata dallequattro righe di testo contenute nella cella che la precede,e la larghezza della cella 3 (appartenendo allamedesima colonna), allo stesso modo, si modifica diconseguenza.

Anche se a prima vista non sembra, da questa seconda tabelladi esempio possiamo estrapolare altre informazioni moltoutili:

Si nota, infatti, chiaramente che se si vuole inserire del testo in una cella si deve nuovamente definire il tipo di carattere usando i consueti TAGs che ormai non dovrebbero aver segreti in quanto, se non specificato, il testo verrà visualizzato con il carattere predefinito del browser (in tutto il resto del documento infatti il carattere è "Arial" mentre in questo esempio il carattere visualizzato è il "Times New Roman").
Si nota, inoltre, che l'allineamento predefinito del contenuto delle celle è a sinistra, orizzontalmente, come appare chiaro nelle celle 1 e 3, e centrato, verticalmente, come risulta palese dalla cella 2.