Siirry sivun sisältöön Avut CSS HTML JS Wp

TABLE-elementti XHTML 1.0 Strict -dokumenttityypissä

TABLE-elementillä merkitään taulukot. Elementti on taulukkoelementtien pääkonteineri, joten se sisältää kaikki muut taulukkoelementit, jotka määrittelevät rivejä, sarakkeita ja muita taulukon rakenteita.

Huomiot

TABLE-elementin sallittu sisältö on hieman totuttua monimutkaisempi. Sille ei voida merkata sisältöä mielivaltaisessa järjestyksessä, vaan merkkausjärjestys noudattaa seuraavaa kaavaa:

1. vapaaehtoinen, mutta enintään yksi CAPTION
2. jota seuraa nolla tai enemmän toisiaan pois sulkevia COL- tai COLGROUP-elementtejä
3. jota seuraa vapaaehtoinen, mutta enintään yksi THEAD
4. jota seuraa vapaaehtoinen, mutta enintään yksi TFOOT
5. jota seuraa nolla tai useampi TBODY
6. jota seuraa yksi tai useampi TR

Näin taulukossa on esiinnyttävä vähintään yksi TR-elementti, joko suoraan TABLE-elementin lapsena, tai sitten sen jälkeläisenä. Teknisesti ajatellen, taulukko koostuu vähintään yhdestä rivistä (TR-elementti), joka sisältää vähintään yhden solun (TD-elementti).

TABLE-elementin attribuutit

BORDER-attribuutti koskee taulukon solujen reunaviivoja. Ominaisuus helpottaa sekä taulukon rakentamista että sen sisällön hahmottamista. Attribuutin arvoksi annetaan kuvapisteitä vastaava luku (Pixels-tietotyyppi), tyypillisesti 1 (border="1"). Kun BORDER-attribuutin arvoa kohotetaan yhtä kuvapistettä suuremmaksi, niin solujen reunaviivat eivät siitä kasva, vaan taulukon ympärille lisätään vastaavan suuruinen kehys. Oletusarvolla 0 (border="0") reunaviivat piilotetaan. Monimutkaisempien taulukoiden reunaviivojen näkyvyyttä voidaan hienosäätää seuraavilla kahdella attribuutilla.

FRAME-attribuutilla vaikutetaan taulukon ulkoisiin reunuksiin. Mahdolliset arvot ovat:

• void - ei reunuksia (oletus)
• above - reunus vain yläosaan
• below - reunus vain alaosaan
• hsides - reunukset vain ylä- ja alaosaan
• vsides - reunukset vain sivuille
• lhs - reunukset vain vasemmalle puolelle
• rhs - reunukset vain oikealle puolelle
• box - kaikki reunukset
• border - kaikki reunukset

RULES-attribuutilla taas vaikutetaan taulukon sisäisiin reunuksiin. Mahdolliset arvot ovat:

• none - ei reunuksia (oletus)
• groups - reunukset vain rivi- tai sarakeryhmien väliin
• rows - reunukset vain rivien väliin
• cols - reunukset vain sarakkeiden väliin
• all - reunukset kaikkien rivien ja sarakkeiden väliin

Miten siis lopulta taulukoiden reunaviivat näkyvät riippuu BORDER-, FRAME- ja RULES-attribuuttien määrityksistä.

CELLSPACING-attribuutti vaikuttaa tyhjään tilaan taulukon solujen välillä. CELLPADDING-attribuutti taas vaikuttaa tyhjään tilaan solujen reunojen ja niiden sisällön välissä. Kummankin attribuutin arvot voidaan antaa kuvapisteinä tai prosenttilukuina (Length-tietotyyppi).

SUMMARY-attribuutilla lisätään taulukkoon tekstitiivistelmä. Attribuutin arvoksi käy teksti (Text-tietotyyppi), jonka avulla kuvataan taulukon tarkoitusta ja sen rakennetta.

WIDTH-attribuutilla voidaan ehdottaa taulukolle oletusarvosta poikkeavaa leveyttä. Attribuutin arvo voidaan antaa kuvapisteinä tai prosenttilukuina (Length-tietotyyppi).

Esimerkki

Seuraavassa kuvitteellisessa esimerkissä käytämme kaikkia TABLE-elementin ominaisia attribuutteja:

<table
 border="6"
 frame="vsides"
 rules="all"
 cellspacing="2"
 cellpadding="6"
 summary="TABLE-elementin attribuutteja
          havainnollistava kuvitteellinen esimerkki."
 width="50%">
<!-- Loput taulukkoelementit tähän -->
</table>

Jolloin määrityksemme ovat:

1. pyydetään taulukolle 6:den kuvapisteen reunus
2. rajataan taulukon ulkoinen reunus koskemaan vain sivureunoja
3. pyydetään taulukon sisäiset reunukset kaikkien rivien ja sarakkeiden väliin
4. pyydetään solujen väliin 2:den kuvapisteen tyhjä tila
5. pyydetään solujen reunojen ja niiden sisällön väliin 6:den kuvapisteen tyhjä tila
6. määritellään taulukolle tekstitiivistelmä
7. pyydetään taulukon leveydeksi 50 % käytettävissä olevasta tilasta

Virheellinen käyttö

Taulukoita on käytetty yleisesti väärin sivujen sisällön asetteluun, niin kutsuttuun taulukkotaittoon. Taulukoita tulee käyttää vain tabulaarisen tiedon merkkaamiseen. Lisätietoja taulukoilla taittamisesta.