Despre tabele

Tabelele se utilizeaza utilizând tag-ul <TABLE>...</TABLE>. Imaginati-va un tabel simplu deschis in Word care cuprinde mai multe casute. In fisierul HTML, casutele sunt organizate pe randuri (rows - linii orizontale de casute). La randul lor, randurile sunt organizate in elemente (casute).
Despre tabele Despre tabele

0

Tabelul de mai sus contine 3 randuri, fiecare rand continand 5 elemente.In interiorul unui tag de tip TABLE, randurile sunt declarate folosind tag-ul <TR>...</TR>, iar in cadrul fiecarui tag TR elementele sunt declarate cu tag-ul <TD>...</TD>. Fiecare element (casuta) poate contine text, imagini, link-uri, etc. Un tabel de tipul celui de mai sus ar fi codificat astfel:

	Cod:
	<TABLE> <TR><TD>1</TD><TD></TD><TD></TD><TD></TD><TD></TD></TR> <TR><TD></TD><TD></TD><TD></TD><TD></TD><TD></TD></TR> <TR><TD></TD><TD></TD><TD></TD><TD></TD><TD></TD></TR> </TABLE>

exemplul de mai sus avem un tag <TABLE>...</TABLE> care delimiteaza tabelul si trei tag-uri <TR>...</TR> corespunzand celor trei randuri ale tabelului. Fiecare tag TR contine cate 5 tag-uri <TD>...</TD>. Intre <TD> si </TD> se introduce continutul efectiv al fiecarei casute. In exemplul de mai sus numai casuta din stanga-sus are continut - cifra 1 (nu incercati exemplul de mai sus, intrucat casutele fara continut nu sunt afisate).

Tag-urile de definire a tabelelor pot avea diferite atribute, pentru formatarea tabelului. Astfel, tag-ul TABLE poate avea:
- WIDTH=x sau WIDTH=x% - acesta specifica mărimea intregului tabel in pixeli (de exemplu WIDTH=500) sau in procente fata de lungimea intregii ferestre (de exemplu WIDTH=50%);
- HEIGHT=x sau HEIGHT=x% - similar cu WIDTH, dar pentru inaltimea intregului tabel (exemple: HEIGHT=300 sau HEIGHT=100%);
- BORDER=x - daca x este 1 atunci tabelul va avea si "cadru" (linii de delimitare a elementelor. Daca x este 0, atunci astea vor lipsi (deci BORDER=0 sau BORDER=1);
- CELLSPACING=x - specifica spatiul dintre casute, in pixeli;
- CELLPADDING=x - specifica spatiul dintre marginea unei casute si continutul acesteia, in pixeli.
Si in acest caz pot fi folosite toate aceste semnale impreuna, numai o parte a lor, sau nici unul. Un tag TABLE ce le foloseste pe toate ar arata astfel:

	Cod:
	<TABLE> .......... </TABLE>

Si tag-ul TD poate avea tot felul de semne interesante:
- WIDTH=x sau WIDTH=x% - lungimea casutei in pixeli sau ca procent din lungimea intregului tabel;
- HEIGHT=x sau HEIGHT=x% - inaltimea casutei in pixeli sau ca procent din inaltimea intregului tabel;
- BGCOLOR=#RRGGBB - nuanță fundalului casutei, ca de exemplu BGCOLOR=#EEEEDD.
- ALIGN=RIGHT, ALIGN=LEFT sau ALIGN=CENTER - modul cum va fi pozitionat continutul casutei in casuta: la dreapta, la stanga sau central;
- VALIGN=TOP, VALIGN=BOTTOM sau VALIGN=CENTER - similar, dar pentru pozitionarea pe verticala: sus, jos sau central.
Tine cont de faptul ca textul din interiorul unei casute trebuie formatat si el la randul sau. O casuta ce ar contine un text rosu pe fond verde deschis s-ar codifica astfel:

	Cod:
	<TD><FONT>text</FONT></TD> doua tabele atipice:

Un întocmai tabel s-ar codifica astfel:

	Cod:
	<TABLE> <TR><TD>CELULA 1</TD><TD>CELULA 2</TD><TD>CELULA 3</TD></TR> <TR><TD>CELULA 4</TD></TR> </TABLE>