Taulukot

Taulukot ovat tehokkaita esitettäessä esimerkiksi numerotietoja, mutta niillä on paljon muutakin käyttöä. Taulukko koostuu mahdollisesta otsikosta, jonka jälkeen tai jota ennen tulee soluja. Solut muodostavat rivejä ja sarakkeita. Solut voivat olla joko otsikkosoluja tai tietosoluja.

TABLE - Taulukot

Taulukko määritellään TABLE-koodien sisälle. ALIGN-attribuutti vaikuttaa taulukon sijoittumiseen. WIDTH kertoo taulukon leveyden joko prosenteissa tai pikseleissä. BORDER kertoo taulukon viivojen paksuuden. CELLSPACING kertoo solujen väliin jätettävän tyhjän tilan pikseleissä. CELLPADDING määrittää kuinka monta pikseliä jätetään väliä tekstin ja solun reunan väliin.

CAPTION - Taulukon otsikko

CAPTION-koodilla määritellään taulukolle otsikko. ALIGN-attribuutti määrittää otsikon sijainnin. CAPTION-koodin pitää olla heti TABLE-koodin jälkeen.

TR - Taulukon rivi

Taulukon rivit määritellään TR-koodein. ALIGN vaikuttaa vaakassuuntaiseen sijoittumiseen ja VALIGN tekstin sijoittumiseen solussa pystysuunnassa.

TH - Taulukon soluotsikko

TH-koodilla luodaan taukon riville solu, jonka tehtävä on toimia otsikkona. Katso parametrien selitykset TD-koodista. Vaikka HTML 3.2:n mukaan lopettava merkki on vapaaehtoinen, kannattaa sitä käyttää, sillä kaikki selaimet eivät tulkitse taulukkoja muuten oikein.

TD - Taulukon solu

TD-koodi tekee taulukon solun, johon sijoitetaan tietoa.

ROWSPAN ja COLSPAN vaikuttavat solun korkeuteen ja leveyteen soluina. Esim. ROWSPAN=2 tekee kaksi riviä korkean solun. NOWRAP estää solun sisältöä jakautumasta usealle riville. Tällöin tarvitaan BR-koodeja rivinvaihtojen aikaansaamiseksi. Lopettava TD-koodi on vapaaehtoinen, mutta suositeltava. Kaikki selaimet eivät muuten tulkitse taulukoita oikein.

WIDTH ja HEIGHT määrittävät solulle toivotun leveyden ja korkeuden pikseleissä. Align vaikuttaa tekstin sijoittumiseen solussa vaakasuunnassa ja VALIGN pystysuunnassa.

Esimerkkejä

<CENTER> <TABLE BORDER=1 ALIGN=center> <CAPTION>Taulukon otsikko</CAPTION> <TR> <TD ROWSPAN=2></TD> <TH COLSPAN=2>Otsikko 1</TH> <TH>Otsikko 2</TH> <TH ROWSPAN=2>Kolmas otsikko</TH> <TR> <TH>Otsikko 4</TH> <TH>Otsikko 5</TH> <TR> <TH>Otsikko 6</TH> <TD>1</TD> <TD>2</TD> <TD>3</TD> <TD>4</TD> <TR> <TH>Otsikko 7</TH> <TD>5</TD> <TD>6</TD> <TD>7</TD> <TD>8</TD> </TABLE> </CENTER>	Taulukon otsikko Otsikko 1 Otsikko 2 Kolmas otsikko Otsikko 4 Otsikko 5 Otsikko 6 1 2 3 4 Otsikko 7 5 6 7 8
<TABLE BORDER CELLSPACING=10> <TR ALIGN=left VALIGN=bottom> <TD>Solu yksi</TD><TD>Solu numero kaksi.</TD> <TR ALIGN=center VALIGN=middle> <TD>Kuva Solussa<BR> <IMG SRC="esim.gif" alt=[MV] WIDTH=40 HEIGHT=30> </TD> <TD>Taulukko solussa! <TABLE border CELLPADDING=10> <TR><TD>1<TD>2 <TR><TD>3<TD>4 </TABLE> </TD> </TABLE>	Solu yksi Solu numero kaksi. Kuva solussa Taulukko solussa! 1 2 3 4