Tabuly sa vytvaraju elementom TABLE. Kazda tabulka by mala obsahovat najviac jedene nadpis (element CAPTION) a aspon jeden riadok (element TR. Kazdy riadok tabulky pozostava z buniek. Bunka moze byt definovana ako nadpis riadka alebo stlpca (element TH) alebo ako datova bunka (element TD).
Napriklad:


<TABLE> <CAPTION>Telefonny zoznam zamestnancov firmy</CAPTION> <TR><TH>Osobne<BR>cislo<TH>Meno<TH>Priezvisko<TH>Telefonne<BR>cislo <TR><TD ALIGN=center>023<TD>Frantisek<TD>Tomas<TD ALIGN=right>0872 123 09 <TR><TD ALIGN=center>105<TD>Helena<TD>Zelena<TD ALIGN=right>123 456 </TABLE>
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Standardne ja tabulka vykreslovana bez ramceka. Ten mozeme doplnit atributom BORDER, ktory zabezpeci vykreslenie ramceka hrubeho 1 pixel alebo atributom BORDER=#, ktory vykresli ramcek hruby # pixelov, kde # je cele nezaporne cislo (teda je pripustne aj BORDER=0 co je vlastne tabulka bez ramceka).


<TABLE BORDER=5> <!-- ramcek hruby 5 pixelov --> ... </TABLE>
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Velkost tabulky sa pocita automaticky z velkosti jednotlivych buniek tak aby bola maximalne 100% zobrazovacieho okna (pokial to nie je dane explicitne). Tato velkost (sirka) sa da nastavit explicitne atributom WIDTH elementu TABLE. Udava sa v pixeloch (cele kladne cislo; napr. WIDTH=300) alebo v percentach (napr. WIDTH=75%). Je dokonca mozne zvolit sirku tabulky vacsiu ako 100% !

Sirka v pixelochSirka v percentach
<TABLE BORDER=3 WIDTH=300> ... </TABLE> <TABLE BORDER=3 WIDTH=75%> ... </TABLE>


Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456



	Toto je tabulka ktorej velkost je dana v pixeloch



Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456



	A velkost tejto
	je zase 75%.


Tabulky su vykreslovane tak, ze text pred tabulkou ja naozaj pred nou a text za tabulkou je naozaj za nou. Ak chceme mat text vedla tabulky, musime pridat atribut ALIGN. Napriklad:


<P> Text <STRONG>pred</STRONG> tabulkou<BR> bla, bla, bla.<BR> bla, bla, bla.<BR> bla, bla, bla.<BR> <TABLE BORDER=3 WIDTH=50% ALIGN=left> <!-- tabulka bude pri lavom okraji --> <CAPTION>Telefonny zoznam zamestnancov firmy</CAPTION> <TR><TH>Osobne<BR>cislo<TH>Meno<TH>Priezvisko<TH>Telefonne<BR>cislo <TR><TD ALIGN=center>023<TD>Frantisek<TD>Tomas<TD ALIGN=right>0872 123 09 <TR><TD ALIGN=center>105<TD>Helena<TD>Zelena<TD ALIGN=right>123 456 </TABLE> <P> Text <STRONG>za</STRONG> tabulkou<BR> bla, bla, bla.<BR> bla, bla, bla.<BR> bla, bla, bla.<BR>

Text pred tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Text za tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.


Teraz na opacnu stranu:


... <TABLE BORDER=3 WIDTH=50% ALIGN=right> <!-- tabulka bude pri pravom okraji --> ... </TABLE> ...

Text pred tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Text za tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.


Zarovnanie samotnej tabulky dosiahneme jej uzavretim do elementu DIV alebo CENTER. Vtedy sa zarovna do prislusneho smeru iba tabulka a pripadny text pred nou alebo za nou ostane bezo zmeny.


... <DIV ALIGN=right> <!-- tabulka bude pri pravom okraji --> <TABLE BORDER=3 WIDTH=50%> ... </TABLE> </DIV> ...

Text pred tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.

Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Text za tabulkou
bla, bla, bla.
bla, bla, bla.
bla, bla, bla.


Sirka ramceka okolo kazdej bunky je standardne nastavena na 2 pixely. sirsie ramceky (alebo uzsie) mozete urobit pridanim atributu CELLSPACING=#, kde # je sirka ramceka v pixeloch. Napriklad:


<TABLE BORDER=3 WIDTH=50% CELLSPACING=7> ... </TABLE>
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Casto je obsah buniek prilis blizko ramcekov a tabulka vyzera velmi "husta". To sa da odstranit atributom CELLPADDING=#, kde # udava odsadenie obsahu bunky od jej ramceka v pixeloch. Napriklad:


<TABLE BORDER=3 WIDTH=50% CELLAPDDING=5> ... </TABLE>
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456

Ak k tomu pridate aj patricne hrube ramceky (okolo tabulky aj jednotlivych buniek), vysledok potom vyzera naozaj efektne.
Telefonny zoznam zamestnancov firmy
Osobne
cislo
MenoPriezviskoTelefonne
cislo
023FrantisekTomas0872 123 09
105HelenaZelena123 456