Perustaulukko
Taulukot muodostuvat kolmesta
osasta: itse taulukosta sekä taulukon riveistä ja
soluista. Näitä jokaista osaa varten on omat taginsa.
<TABLE></TABLE>-tagit
ovat taulukon aloitus- ja lopetustagit.
Parametrilla BORDER kerrotaan taulukon
reunaviivan paksuus pikseleinä.
Parametri WIDTH kertoo taulukon
leveyden.
Leveys voidaan ilmoittaa joko %-lukuna tai pikseleinä.
Jos WIDTH-parametriä ei kirjoiteta, muotoutuu taulukon
leveys siihen kirjoitetun tekstin mukaan.
Parametri CELLSPACING säätelee solujen
välissä olevaa tilaa. Parametri CELLPADDING
puolestaan määrittelee solun seinämien ja tekstin
väliin jäävä tilan. Cellspacingille ja
Cellpaddingille annetaan arvot pikseleinä.
Koko taulukolle, sekä yksittäisille riveille ja
soluille voidaan määritellä taustaväri kirjoittamalla
BGCOLOR-parametri haluttuun tagiin.
Parametrille annetaan RGB-väriarvo samalla lailla kuin
sivun taustaväri määritellään.
<TR> </TR>-tageilla
lisätää taulukon rivit.
<TD> </TD>
-tageilla lisätään solut. Eri riveillä voi myös olla
eri määrä soluja.
Taulukon otsikko
<CAPTION></CAPTION>
-tagien avulla voidaan taulukolle antaa otsikko.Otsikon
voi siirtää myös taulukon alle kirjoittamalla
<CAPTION>-alkutagiin parametriksi ALIGN=BOTTOM.
Esimerkki:
<TABLE BORDER =1 WIDTH=50%>
<CAPTION>Taulukko-esimerkki </CAPTION>
<TR>
<TD WIDTH=50%>1. rivi 1. Solu</TD>
<TD WIDTH=50%>1. rivi 2. Solu</TD>
</TR>
<TR>
<TD WIDTH=50%>2. rivi 1. Solu</TD>
<TD WIDTH=50%>2. rivi 2. Solu</TD>
</TR>
<TR>
<TD WIDTH=50%>3. rivi 1. Solu</TD>
<TD WIDTH=50%>3. rivi 2. solu</TD>
</TR>
</TABLE>
NÄYTTÖ:
Taulukko-esimerkki
1. rivi 1.
Solu |
1. rivi 2.
Solu |
2. rivi 1.
Solu |
2. rivi 2.
Solu |
3. rivi 1.
Solu |
3. rivi 2.
solu |
Esimerkki:
<CAPTION ALIGN=BOTTOM>Taulukko-esimerkki
</CAPTION>
Rivien ja solujen muotoilu
Tekstiä voidaan asetella
soluissa, sillä sekä rivitageihin että solutageihin
voidaan tehdä määrityksiä tekstin yms. asettelusta
vaaka- ja pystysuunnassa. ALIGN-parametrillä
vaikutetaan vaakasuunnassa tapahtuvaan asetteluun:
left - teksti tasataan vasempaan reunaan
right - teksti tasataan oikeaan reunaan c
enter - teksti keskitetään
VALIGN-parametrilla asetellaan tekstiä
pystysuunnassa:
top - teksti asetetaan yläreunaan
bottom - teksti asetetaan alareunaan
middle - teksti asetetaan solun keskelle
COLSPAN -parametrillä voidaan solua
venyttää vaakasuunnassa useamman sarakkeen kokoiseksi. ROWSPAN
-parametri venyttää solua puolestaan pystysuunnassa.
Huomaa, ettei ROWSPAN ja COLSPAN -parametrejä ei kannata
yhdistää. WIDTH-parametrilla
määritellään sarakkeen leveys. BGCOLOR-parametrilla
voidaan yksittäisille riveille tai soluille
määritellä taustaväri, kirjoittamalla ko. parametri
haluttuun tagiin. Parametrille annetaan RGB-väriarvo
samalla lailla kuin sivun taustaväri määritellään.
Esimerkki:
<TABLE WIDTH = 40% BORDER = 1>
<TR ALIGN=center>
<TD>WWW</TD>
<TD>HTML</TD>
<TD>INTERNET</TD>
</TR>
</TABLE>
Kaikki tämän rivin solujen tekstit keskitetään.
NÄYTTÖ:
<TABLE WIDTH =
40% BORDER = 1>
<TR>
<TD>WWW</TD>
<TD ALIGN=CENTER>HTML</TD>
<TD>INTERNET</TD>
</TR>
</TABLE>
Kun taas tässä vain rivin toisen solun teksti on
keskitetty.
Esimerkki : <TD COLSPAN=2></TD>
Levittää solun kahden sarakkeen mittaiseksi.
Esimerkki :
<TD ROWSPAN=3></TD>
Levittää solua kolmen rivin kokoiseksi.
Esimerkki:
a) <TABLE BORDER=1 BGCOLOR="#00FF00"> ...
</TABLE>
b) <TABLE
BORDER=1>
<TR>
<TD>tekstiä</TD>
<TD BGCOLOR="#00FF00">tekstiä</TD>
<TD>tekstiä</TD>
</TR>
</TABLE>
|