[IMAGE]

Taulukot
Kirjan sivut
81 - 86 
Taulukoilla jaat kätevästi asiat eri palstoihin. Netscape:ssa on oma tag palstoitusta varten, mutta jos haluat että muutkin näkevät luomuksesi sellaisina kun olet ne tehnyt, niin käytä taulukoita. Tämä tarkoittaa sitä, että taulukoita monesti käytetään sivujen ulkoasun hallintaan. Taulukkoa toki voidaan käyttää myös sen alkuperäiseen käyttökohteeseen eli taulukkomuodossa esitettäviin listoihin, rekistereihin tai vastaaviin.

Taulukko luodaan TABLE-elementillä.

<TABLE>.........</TABLE>
<TABLE>Aloittaa taulukon ja </TABLE> tulee viimeiseksi taulukossa. Kun lisäät TABLE-aloitukseen  BORDER-attribuutin, saat taulukolle reunat. Voit myös määritellä paksummat reunat antamalla BORDER:lle jonkun arvon pikseleinä, esim. <TABLE BORDER=5>. Huomaa, että taulukon BORDER-attribuutti luo arvolla 1 kaikkien solujen väliin samankokoisen reunan. Kun arvoa kasvatetaan, kasvaa vain taulukon ulkoreunan leveys.

<CAPTION ALIGN=TOP>.....</CAPTION> Taulukon otsikko. TOP:n sijaan voit käyttää myös BOTTOM:ia, jolloin otsikko tulee taulukon alapuolelle. 

Caption tulee taulukossa <TABLE>-aloituksen jälkeen.

<TR> Aloittaa taulukon rivin. TR ei tarvitse lopetuselementtiä, mutta sen voi laittaa rivin lopuksi.
<TH>......</TH> Taulukon soluun tuleva otsikko. Eroaa TD:stä siinä, että solun sisältö on lihavoitu.
<TD>......</TD> Taulukon solun sisältö.

Kun alat tekemään taulukkoa, niin tee aina yksi rivi kerralla ja sitten seuraava rivi jne.

Perustaulukko:
<TABLE BORDER=1>

<CAPTION>otsikko</CAPTION>

<TR><TH>sarake 1</TH><TH>sarake 2</TH><TH>sarake 3</TH>

<TR><TD>2 rivi sarake 1</TD><TD>2 rivi sarake 2</TD><TD>2 rivi sarake 3</TD>

</TABLE>
otsikko
sarake 1 sarake 2 sarake 3
2 rivi sarake 1 2 rivi sarake 2  2 rivi sarake 3
 

Solujen koon muutos. Voit tehdä osasta soluista joko useamman sarakkeen levyisen tai rivin korkuisen. COLSPAN-attribuutilla levennät solua useamman sarakkeen levyiseksi. Kun luot taulukon, jossa on COLSPAN- ja ns. normaaleja soluja, laske ensi tarvittavien sarakkeiden määrä. Sitten laske solujen määrä yhdellä rivillä:
colspan=3 + normaali solu = 4 solua. 
Laita jokaiselle riville aina sama yhteismäärä soluja. Eli, jos seuraavalla riveillä on vain tavallisia soluja, tulisi niitä neljä.

Malli:
<TABLE> 
<TR><TH COLSPAN=3>leveä otsikko</TH> 

<TR><TD>asia</TD><TD>asia</TD><TD>asia</TD> 

<TR><TD>asia</TD><TD>asia</TD><TD>asia</TD> 

</TABLE>

leveä otsikko
asia asia asia
asia asia asia

ROWSPAN
-atrribuutilla saat nostettua tietyn solun korkeutta. Ensimmäiselle riville kirjoitat halutun rivikorkeuden määrän ja jatkat rivin muiden solujen tekemistä normaalisti. Seuraavilla riveillä, niin kauan kun ROWSPAN on voimassa, jää riveiltä ensimmäinen solu pois.
<TABLE BORDER=1>

<TR><TH ROWSPAN=3>korkea otsikko</TH><TD>asia</TD><TD>asia</TD> 

<TR><TD>asia</TD><TD>asia</TD>

<TR><TD>asia</TD><TD>asia</TD>

</TABLE>
korkea otsikko asia asia
asia asia
asia asia
Muita taulukon attribuutteja:

<TABLE CELLSPACING=10> Määrittelee solujen välin pikseleinä. 

<TABLE CELLPADDING=10> Määrittelee soluissa olevan sisällön etäisyyden solun reunoista.

<TR>, <TH>, <TD> elementteihin voidaan lisätä ALIGN=LEFT, RIGHT tai CENTER, jolloin saadaan solujen sisällön tasaustapaa määriteltyä.

<TR>, <TH>, <TD> elementteihin voidaan lisätä myös VALIGN=TOP, MIDDLE, BOTTOM tai BASELINE, jolloin saadaan solujen sisällön tasaustapaa pystysuunnassa määriteltyä.

Kuten kuvia voidaan myös koko taulukkoa tasata vasempaan, keskelle tai oikealle. <TABLE ALIGN=LEFT> Tasaa taulukon vasempaan reunaan ja teksti kiertää taulukon. <TABLE ALIGN=RIGHT> Tasaa taulukon oikeaan reunaan ja teksti kiertää taulukon

<CENTER> <TABLE> ....... ....... ....... </TABLE> </CENTER> Keskittää koko taulukon keskelle sivua. Voit Netscapelle määritellä, kuinka paljon tyhjää tilaa jaa taulukon ylä-, ala-, vasemmalle ja oikealle puolelle. <TABLE VSPACE=5 HSPACE=5> jättää taulukon reunoille 5 pikseliä tyhjää tilaa.

Solun väri <TH BGCOLOR=”#FF0000”> tai <TD BGCOLOR="#FF0000">

Taustakuva solulle <TH BACKGROUND=”kuva.gif”>

Reunuksen väri  <TABLE BORDERCOLOR=”#FF0000”> 

Taulukkomalleja

Kooste:
Elementti Attribuutit / selitykset
<TABLE> - </TABLE> Taulukko
width - taulukon leveys
align - keskitystapa
cellspacing - solujen etäisyys toisistaan
cellpadding - solun sisällön etäisyys reunasta
background - taustakuva
bgcolor - taustan väri
border - ulkoreunan paksuus
<THEAD> - </THEAD> Taulukon ylätunniste
<TFOOT> - </TFOOT> Taulukon alatunniste
<TBODY> - </TBODY> Taulukon runko-osa
<TR> - </TR>  Rivin aloitus taulukossa
align - rivillä olevien solujen keskitystapa
valign - rivillä olevien solujen keskitystapa pystysuunnassa
height - rivin korkeus eli solujen korkeus rivillä
bgcolor - rivin solujen taustaväri 
<TD> - </TD> Taulukon solu
width - leveys
height - korkeus
align - keskitystapa
valign - keskitystapa pystysuunnassa
bgcolor - taustan väri
background - taustakuva
colspan - solujen leveys sarakkeina
rowspan - solujen korkeus riveinä
<COLGROUP> - </COLGROUP> Sarakeryhmä
align - keskitystapa
valign - keskitystapa pystysuunnassa
width - leveys
<COL> - </COL> Sarake
align - keskitystapa
valign - keskitystapa pystysuunnassa
width - leveys
span - kuinka monta saraketta