 Cerchi
un casco per la tua moto a 50 euro?Compralo su Ebay, RISPARMI! |
|
|
|
Table Tutor- Lezione 4Leviamoci di torno CELLPADDING e CELLSPACING e torniamo alla nostra vecchia e semplice tabella.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Una caratteristica dei browser più recenti è la possibilità di specificare un colore di sfondo per ciascuna cella, riga o per l'intera tabella. Per fare questo si usa l'attributo BGCOLOR proprio come nel tag <BODY>.
<TABLE BORDER=3 BGCOLOR="#FFCC66">
<TR>
<TR>
</TABLE>
<TABLE BORDER=3>
<TR BGCOLOR="#FF9999">
<TR BGCOLOR="#99CCCC"> </TABLE>
<TABLE BORDER=3>
<TR BGCOLOR="#FFCCFF">
<TR> </TABLE>
Ecco qui una mappa pratica che di solito utilizzo per scegliere i colori dello sfondo. Un'ultima cosa riguardo ai colori di sfondo nelle tabelle... un colore di sfondo di cella (<TD>) copre quello di riga (<TR>) e uno di riga (<TR>) copre uno di tabella (<TABLE>). Non credo servano ulteriori spiegazioni, ma mi diverte giocherellare coi colori per cui vi passo un esempio:
<TABLE BORDER=3 BGCOLOR="#FF6633">
<TR BGCOLOR="#009900">
<TR>
</TABLE>
Dammi un minuto adesso per spiegare una cosa. Un browser cerca di interpretare nel migliore modo possibile le istruzioni che riceve. Se c'è qualcosa che non è stato specificato in un modo o nell'altro, la maggior parte dei browser cercherà di visualizzare la pagina nella maniera che ritiene migliore. E' quindi estremamente importante che un autore di pagine HTML specifichi esplicitamente più cose possibile, specialmente gli attributi cruciali perchè le pagine vengano visualizzate correttamente. E' anche molto importante visualizzare il proprio lavoro utilizzando i browser più comuni. Dal momento che moltissimi usano Netscape, questo è un buon punto di partenza. In ogni caso tieni anche una copia di qualche altro browser per essere sicuro che anche con quelli le tue pagine abbiano un buon aspetto. Adesso giocheremo con COLSPAN (eSPANsione su COLonne) and ROWSPAN (espansione su righe). Immaginimo che Ed se la prenda a morte con Tom e lo scaraventi fuori dalla tabella. Ecco quello che succede in questo caso.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Se però vogliamo che Ed si impossessi dello spazio che prima era di Tom, allora dobbiamo utilizzare l'attributo COLSPAN.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Tanto per rimarcare quello che ho detto poc'anzi, riguardo al browser che cerca di visualizzare al meglio le pagine, facciamo che Ed si allarga per due colonne ma rimettiamo Tom al suo posto. Abbiamo deliberatamente introdotto una discrepanza tanto per vedere che cosa si inventa il browser.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
OK... risbattiamo fuori il povero Tom.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Rick, spaventato, se ne va pure lui. Ed si prende il suo spazio e si piazza nel bel mezzo della cella tanto per mostrare di che pasta è fatto.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Naturalmente all'interno di una cella è possibile utilizzare tutti gli altri codici HTML. Ad esempio possiamo mettere Ed in grassetto <STRONG>.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Possiamo piazzare un link alla mia Home Page.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Ora ripuliamo la tabella e rimettiamoci Tom e Rick per passare al <ROWSPAN>.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Come forse puoi immaginare, <ROWSPAN> funziona esattamente come <COLSPAN> tranne per il fatto che si espandono righe invece che colonne. (E' più semplice della Cosmogonia Sumera non trovi?) Se leviamo Larry e assegnamo ad Ed la sua parte di spazio, otteniamo questo.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
Naturalmete è anche possibile utilizzare una combinazione dei due attributi.
<TABLE BORDER=3>
<TR>
<TR>
</TABLE>
|
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|