Usare le tabelle per impostare il layout di una pagina

Le molteplici possibilità di configurazione delle tabelle le rendono adatte per costruire layout anche complessi, impostate su più colonne. Fino all’avento dei CSS, questo è stato l’unico sistema disponibile per realizzare pagine Web elaborate, ed è ancora molto utillizzato.
Si ipotizzi di voler costruire una pagina composta secondo con un layout molto comune.
L’unico modo per farlo è costruire una tabella con due colonne e una riga, in cui inserire i vari contenuti dell’intera pagina. Ecco il codice necessario:


<table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#CCCCCC>
<tr bgcolor="#CCCCCC">
<td colspan="2">

<p align="center"><font size="7" face="Geneva, Arial, Helvetica, sans-serif">INTESTAZIONE</font></p>

</td>
</tr>
<td width="150">

<p align="center">font face="Geneva, Arial, Helvetica, sans-serif">NAVIGAZIONE</font></p>

</td>
<td height="400">

<p align="center>
<font size="7" face="Geneva, Arial, Helvetica, sans-serif">Corpo della pagina</font></p>

</td>
</tr>
</table>

La tabella composta realizzata quello che solitamente viene chiamato un layout elastico: avendo fissato la larghezza totale della tabella al 100%, essa tenderà ad adattarsi alle dimensioni della finestra del browser. Tuttavia, dato che la cella della navigazione ha una larghezza fissata in pixel, solo la cella contenente il corpo della pagina e quella dell’intestazione si adatterranno alla risoluzione.
Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...