Con questo post inizierò a trattare per gradi la creazione di testo e tabelle preformattati.
Una tabella HTML, simile a qualsiasi altra tabella stampata, consiste di colonne e righe contente dati. HTML prevede due modi per preservare il layout del testo. Uno è generco, l’altro è specifico per le tabelle. In questo post concentreremo l’attenzione sulla descrizione del modo generico.

Inserimento del testo preformattato

HTML in genere ignora gli spazi in eccesso. Il tag <PRE> induce invece il browser a tenerne conto. A questo punto entrano in gioco le tabelle, dal momento che per crearle occorre lasciare un numero corretto di spazi per garantire l’allineamento di righe e colonne. Seuge un semplice frammento HTML che usa il tag <pre>:

<H1>Record visite |Omnia Blog|</H1>
<PRE>
Record giornaliero: 3,126 visite
Record settimanale: 16,142 visite
Record mensile: 58,561 visite
</PRE>

Ho inserito i tag <pre> e </pre> in righe a parte in modo che si possano vedere più chiaramente, ma non è necessario fare lo stesso nei documenti HTML. Dunque in questo esempio si crea una semplice tabella a due colonne, che senza i tag di preformattazione ( <pre> e </pre> ) si sarebbe disposto su una sola riga, senza spazi vuoti extra, come segue:

Record giornaliero: 3,126 visiteRecord settimanale: 16,142 visiteRecord mensile: 58,561 visite

Il tag <pre> istruisce il browser a visualizzare le informazioni in formato tabella. Inoltre il tag <pre> ha una caratteristica opzionale: la possibilità di specificare la lunghezza del testo preformattato. Ecco un esempio:

<PRE WIDTH=65>Questo testo formattato è limitato in larghezza a 65 centimetri</PRE>

Ecco un video tutorial da me realizzado e montato da Marco che renderà più chiaro l’uso del tag <pre>:

[daily ID=http://dailymotion.alice.it/video/x5knfy_tutorial08_tech]

Per scaricare il video e vederlo con una risoluzione migliore cliccate qui.