Taulukot / Table

Taulukot saattavat tuntua vanhanaikaiselta tavalta luoda www-sivuille ulkoasuja. On totta että DIV-tageilla ja CSS-tyyleillä on puolensa ja niillä voidaan tehdä välillä suorastaan uskomattomia asioita, mutta taulukoillakin on puolensa. Jos tarkkoja ollaan, Dreamweaver käyttää oletusarvoisesti taulukkoja ulkoasuja luotaessa.

Dreamweaver tarjoaa kolme eri tapaa katsoa taulukoita sivuja suunniteltaesa Standard (vakio), Expanded (laajennettu) tai Layout (suunnittelu) tilassa. Näiden kolmen tilan suurin ero on juuri siinä kuinka ne näyttävät ja käsittelevät taulukoita. Standard- ja Expanded-tilassa voidaan toki työskennellä myös DIVeillä ja tasoilla, mutta Layout-tilassa vain taulukoilla työskentely on mahdollista.

Taulukossa on yksi tai useampi rivi ja jokaisessa rivissä on yksi tai useampi palsta. Yksittäistä palstaa yksittäisellä rivillä kutsutaan soluksi. Tarkennetaan vielä: palstassa on soluja päällekkäin ja rivissä niitä on vierekkäin.

Yllä olevassa taulukossa on kaksi riviä ja ylemmässä rivissä on kolme palstaa, alemmassa puolestaan kaksi. Soluja on yhteensä viisi. Alemman rivin leveämpi taulukko on kahden palstan levyinen ja tästä ko. palstan määreenä on colspan="2". Colspan on suomeksi palstajänne ja sillä ilmaistaan että kuinka monenpalstan levyinen kyseinen solu on. Solu voi olla myös useamman rivin korkuinen ja silloin sen määreenä on rowspan="rivien lukumäärä".

Taulukon reunus on yhden pikselin paksuinen ja solujen välistys on neljä pikseliä. Koska soluissa ei ole lainkaan näkyvää sisältöä, solujen sisäistä marginaalia ei voi havaita, mutta se on myös neljän pikselin levyinen. Marginaali (padding) tarkoittaa sitä solut eivät päästä mitään neljää pikseliä lähemmäs niiden reunaa.

Taulukon luomiseen eri tavoin voi tutustua tarkemmin Standard ja Layout tiloista kertovilla sivuilla. Esimerkkitaulukon mukaisen kahden tai useamman solun yhdistäminen tehdään Properties-ikkunan avulla. Ensin aktivoidaan halutut solut joko klikkaamalla ensimmäiseen soluun ja sitten pyyhkäisemällä yhdistettävien solujen yli (hiiren nappi painettuna) tai sitten yksitellen käyttämällä jotain seuraavista menetelmistä:

Klikkaa kursori haluamaasi soluun ja sitten valitse Edit > Select All. Valitsemalla tämän jälkeen Edit > Select Parent Tag valitaan ensin koko rivi ja vielä kerran Edit > Select Parent Tag aktivoituu koko taulukko.
Klikkaamalla ensin yhtä solua CTRL (Win) / Komento (Mac) näppäin painettuna ja sitten seuraav(i)a solu(ja) näppäin edelleen painettuna, kunnes kaikki halutut solut ovat aktivoituna.
Klikkaamalla ensin yhtä solua CTRL (Win) / Komento (Mac) näppäin painettuna ja sitten saman rivin/palstan viimeistäaktivoitava solua Shift-näppäin painettuna aktivoidaan myös kaikki ensimmäiseksi ja viimeksi klikatun solun välissä olleen solut.
Klikkaamalla aktivoitavaan soluun ja sitten valitsemalla dokumentti-ikkunan vasemmasta alakulmasta <td>.
Myös solut jotka eivät ole vierekkäin, on mahdollista aktivoida (esim. taustavärin määrittämiseksi ja se tapahtuu klikkaamalla solua CTRL (Win) / Komento (Mac) näppäin painettuna. Tällöin aktivoitumaton solu aktivoituu ja aktivoitu solu vapautuu.

Voit aktivoida myös kokonaisen rivin tai palstan kerralla (edellämainittujen tapojen lisäksi) seuraavilla tavoilla:

Vie kursori joko rivin vasempaan reunaan tai palstan yläreunaan – aivan kiinni reunaan - jolloin kursori muuttuu paksuksi rivin/palstan suuntaiseksi nuoleksi ja ko. palstan/rivin solut saavat ohuen punaisen kehyksen. Nyt klikkaamalla koko rivi/palsta aktivoituu.
Klikkaa kerran taulukon alueelle. Nyt taulukon yläreunaan ilmestyy vihertävä palkki jossa pieni nuoli. Klikkaa tuota nuolta ja saat ponnahdusvalikon auki, josta voit valita ensimmäisen vaihtoehdon "Select Column". Tämä keino ei toimi riveissä, mutta sillä voi valita kokoainsen taulukon. Tällöin tulee valita se ylin nuoli keskeltä vihertävää palkkia.

Kokonaisen taulukon voi valita kerralla ja se tapahtuu viemällä kursori taulukon vasempaan yläreunaan, jolloin kursorin pitäisi olla oheisen kuvan mukainen. Klikkaus tässä tilassa aktivoi koko taulun.