Ero sivun ”Taulukoiden luominen” versioiden välillä
Rivi 901: | Rivi 901: | ||
|- | |- | ||
</nowiki></pre></blockquote> | </nowiki></pre></blockquote> | ||
− | |||
− | |||
− | |||
− |
Nykyinen versio 26. marraskuuta 2006 kello 05.15
Tämä sivu lainattu suomenkielisestä Wikipediasta lisenssillä GNU Free Documentation License. Alkuperäinen sivu osoitteessa: http://fi.wikipedia.org/wiki/Taulukoiden_luominen
Wikissä voi kirjoitella HTML- ja XML-tauluja, mutta sitä ei suositella. Käytetään mieluimmin wiki-formaattia, jota kutsutaan myös nimellä putkimuoto (Malline:K-en). Wikitaulu on helppo kirjoittaa, mutta mutkikkaita tauluja on silläkin vaikea luoda.
Sisällysluettelo
- 1 Mikä on taulukko
- 2 Wikitaulu-muoto
- 3 Taulukon tyyli
- 4 Yksinkertainen esimerkki
- 5 Taulukon perusrakenne
- 6 Kertotaulu-esimerkki
- 7 Väri, määritteen ulottuvuus
- 8 Monen määritteen asettaminen
- 9 Leveys ja korkeus
- 10 Yksittäisten rivien ja sarakkeiden leventäminen toisten solujen alueelle
- 11 Wikitaulu HTML:nä
- 12 Wikin ja HTML:n vertailu
- 13 Galleria
- 14 Kelluva taulukko
- 15 Tekstin tasaus, text align
- 16 HTML-taulukon muuttaminen wikitaulukoksi
- 17 Milloin taulukon tekeminen ei kannata
- 18 Wikitable
Mikä on taulukko
Taulukko on riveistä ja sarakkeista koostuva kokonaisuus. Rivin ja sarakkeen risteyskohdassa on solu. Monesti taulukossa on myös otsikko ja sarakkeiden otsikot. Usein monta solua on yhdistetty joko vaaka- tai pystysuunnassa.
Wikitaulu-muoto
Wikitauluissa käytetään niin sanottua. putkisyntaksia (Malline:K-en)
- Taulu alkaa merkeillä "
{|
taulun lisämääreet" ja loppuu riviin "|}
". - Taulun otsikko on "
|+
caption " mikä kirjoitetaan välittömästi taulukon alkumerkin "{|
" jälkeen. - Taulukon rivi alkaa merkillä "
|-
taulukon lisämääreet eli parametrit ", ja sarakkeet merkeillä rivinvaihto tai "|" - |:n tai rivinvaihtojen erottamat solut voivat tekstin lisäksi myös sisältää määritteitä.
Solun tiedot: "| Solun sisältö " tai "| solun määritteet | Solun sisältö "
- Ensimmäinen rivin solu aloitetaan huutomerkillä ! jos kyseessä on sarakkeen otsikko
- Määritteet ovat normaalia HTML-koodia, esim
color="#FFFFFF"
Taulukon tyyli
Taulukon tyyli määritellään kuin HTML:n tyylitagissa (Malline:K-en).
Yksinkertainen esimerkki
Yksinkertainen taulukko on seuraavanlainen:
{| {{prettytable}} <!-taulukon määrite--> |- | Solu 1, rivi 1 | Solu 2, rivi 1 |- | Solu 1, rivi 2 | Solu 2, rivi 2 |}
{| {{prettytable}} |- | Solu 1, rivi 1 || Solu 2, rivi 1 |- | Solu 1, rivi 2 || Solu 2, rivi 2 |}
Yllä olevat taulukkolistaukset näyttävät seuraavanlaiselta:
Solu 1, rivi 1 Solu 2, rivi 1 Solu 1, rivi 2 Solu 2, rivi 2
Taulukon perusrakenne
Yksinkertainen perustaulukko
{|<!--taulukon määrite--> {{prettytable}} |- ! Sarakkeen 1 otsikko ! Sarakkeen 2 otsikko |- <!-- taulukko alkaa tästä --> | rivi1, solu1 || rivi1, solu2 |- | rivi2,solu 1|| rivi2, solu2 |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
Sarakkeen 1 otsikko Sarakkeen 2 otsikko rivi1, solu1 rivi1, solu2 rivi2,solu 1 rivi2, solu2
Kertotaulu-esimerkki
<!-- taulukon määritteet: luokka wikitable, siisti taulukko, ja taulukon tekstin tasaus keskelle, text align:center --> {| class="wikitable" style="text-align:center" |+Kertotaulu |- ! × !! 1 !! 2 !! 3 |- ! 1 | 1 || 2 || 3 |- ! 2 | 2 || 4 || 6 |- ! 3 | 3 || 6 || 9 |- ! 4 | 4 || 8 || 12 |- ! 5 | 5 || 10 || 15 |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
Kertotaulu × 1 2 3 1 1 2 3 2 2 4 6 3 3 6 9 4 4 8 12 5 5 10 15
Väri, määritteen ulottuvuus
Solun määrite on solun ominaisuus, esim yksittäisen solun väri. Wikissä voidaan väri ulottaa koko tauluun, yksittäiseen riviin tai yksittäiseen soluun. Väreistä käytetään englanninkielisiä nimiä red, green, yellow ja niin edelleen, tai heksadesimaalikoodeja, jotka ovat muotoa #000000 (musta, black). Heksadesimaaliväri esitetään RGB-muodossa (red, green, yellow eli punainen, vihreä ja keltainen). RGB-merkintä menee #RRGGBB, jossa RR on värin punainen osa, GG vihreä ja BB keltainen osa. 00 ei väriä, FF täysi väriannos. Heksadesimaaliluvut eli 16-järjestelmän luvut ovat 0-9, A-F.
Esimerkiksi kirkkaan punainen on #FF0000, himmeämmän punainen #7F0000. Keltainen on #FFFF00, koska keltaisessa on punaista ja vihreää.
{| | bgcolor=red | <font color=white> abc | def <!-- punainen taustaväri ulottuu yhteen soluun--> | style="background:red; color:white" | ghi | jkl |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
abc def ghi jkl
Toinen esimerkki
<!-- taustaväri keltainen, yellow, ulottuu koko riville, samoin kuin tekstin vihreä (green) väri--> {| style="background:yellow; color:green" |- | abc | def | ghi |- style="background:red; color:white" <!--ulottuu koko riville--> | jkl | mno | pqr |- | stu | style="background:silver" | vwx | yz |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta
abc def ghi jkl mno pqr stu vwx yz
- HTML 4.01 määrittää 16 esimääriteltyä väriä, joiden heksadesimaalitunnukset ovat:
black #000000 silver #c0c0c0 maroon #800000 red #ff0000 navy #000080 blue #0000ff purple #800080 fuchsia #ff00ff green #008000 lime #00ff00 olive #808000 yellow #ffff00 teal #008080 aqua #00ffff gray #808080 white #ffffff
Monen määritteen asettaminen
Wiki-koodi
{| |- | bgcolor=red|cell1 || width=300px bgcolor=blue <!-- sarakkeen leveys ja taustaväri astettaan yhtä aikaa--> |cell2 || bgcolor=green|cell3 |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
cell1 cell2 cell3
Leveys ja korkeus
Koko taulukon ja rivin sekä taulukon solujen leveyttä ja korkeutta (width, height) voi säädellä.
{| style="width:75%; height:200px" border="1" |- | abc | def | ghi |- style="height:100px" | jkl | style="width:200px" |mno | pqr |- | stu | vwx | yz |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
abc def ghi jkl mno pqr stu vwx yz
Yksittäisten rivien ja sarakkeiden leventäminen toisten solujen alueelle
Wikitaulussa käytettään samaa tapaa kuin HTML:ssä solujen yhdistämiseen. Esimerkiksi colspan=2 leventää taulukon solua kahden solun alueelle, ja rowspan=3 pidentää solua kahden rivin alueelle. Colspanin ja rowspanin käyttö vaatii taitoa.
Colspan (sarakkeiden ulottaminen toisiin soluihin)
{| border=1 | Sarake 1, rivi 1 |rowspan=2| Sarake 2, rivi 1 (ja myös 2) | Sarake 3, rivi 1 |- | Sarake 1, rivi 2 | Sarake 3, rivi 2 |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
Sarake 1, rivi 1 Sarake 2, rivi 1 (ja myös 2) Sarake 3, rivi 1 Sarake 1, rivi 2 Sarake 3, rivi 2
Suurempi esimerkki
{| border="1" cellpadding="5" cellspacing="0" |- ! Sarake 1 || Sarake 2 || Sarake 3 |- | rowspan=2| A | colspan=2 align="center"| B |- | C | D |- | E | colspan=2 align="center"| F |- | rowspan=3| G | H | I |- | J | K |- | colspan=2 align="center"| L |}
Yllä oleva taulukkolistaus näyttää seuraavanlaiselta:
Sarake 1 Sarake 2 Sarake 3 A B C D E F G H I J K L
Solujen tekstin muotoilu
Keskittäminen
- Solun sisällä olevan tekstin keskittäminen käy seuraavalla tavalla:
<center>Solu</center>
- Se käy pipe-syntaksissa helpommin tyyliin:
center | Solu
Wikitaulukoodi
<blockquote> {| cellpadding=0 cellspacing=0 |align=right| 432 || .1 |- |align=right| 43 || .21 |- |align=right| 4 || .321 |} </blockquote>
- Ylläoleva taulukkolistaus näyttää seuraavanlaiselta:
432 .1 43 .21 4 .321
<blockquote> {|border = 1 cellpadding=4 cellspacing=2 width=72 | {|cellpadding=0 cellspacing=0 width="100%" |align=right width="50%"| 432 ||width="50%"| .1 |} |- | {|cellpadding=0 cellspacing=0 width="100%" |align=right width="50%"| 43 ||width="50%"| .21 |} |- | {|cellpadding=0 cellspacing=0 width="100%" |align=right width="50%"| 4 ||width="50%"| .321 |} |} </blockquote>
Ylläoleva taulukkolistaus näyttää seuraavanlaiselta:
432 .1
43 .21
4 .321
Wikitaulu HTML:nä
Wikitaulu tuottaa aina HTML:ää Wikipedian systeemissä.
Taulukot
Taulukon määritelmä:
{| ''määritteet'' |}
- Jota vastaa HTML:n
<table ''määritteet''> </table>
- Välilyönti oltava
{|
;:n jälkeen.
Rivit
HTML:n <tr>:tä vastaava uusi rivi alkaa wikitaulussa
|-
<tr>
Määritteitä (väri jne) lisätään jokaista riviä koskien näin
|- määritteet
Joka tuottaa HTML:ään
<tr määritteet>
Solut
Uusia soluja tuotetaan kirjoitamalla näin.
|solu1 |solu2 |solu3
Tai myös näin
|solu1||solu2||solu3
Joista molemmat vastaavat HTML:n
<td>solu1</td><td>solu2</td><td>solu3</td>
ja niin "||" vastaa "rivinvaihto" + "|"
Parameters in cells can be used like this:
|params|cell1||params|cell2||params|cell3
which will result in
<td määritteet>solu1</td> <td määritteet>solu2</td> <td määritteet>solu3</td>
Otsakkeet
Rivien otsakkeet toimivat kuin
HTML:n tagi TD, paitsi "!" :tä käytetään rivin tai sarakkeen otsikon tunnuksena "|". "!!" :ta voi käyttää "||":n tilalla. Määritteiden erottimena käytetään !:ta huolimatta "|"
Esim: !määritteet|solu1
Otsikot
A <caption> HTML-tagia vastaa
|+ Otsikko
Joka tuottaa
<caption>Otsikko</caption>
Voit myös käyttää määritteitä
|+ määritteet|Otsikko
Joka tuottaa
<caption määritteet>Otsikko</caption>
Wikin ja HTML:n vertailu
Wikitaulu-putkimuoto ja HTML vertailtuna.
XHTML | HTML & Wiki-td | Wikiputki (engl. Wiki-pipe) | |||||||
---|---|---|---|---|---|---|---|---|---|
Taulu | <table></table> | <table></table> | {| määritteet |} | ||||||
Otsikko | <caption></caption> | <caption></caption> | |+ otsikko | ||||||
Rivi | <tr></tr> | <tr> | |- määritteet | ||||||
Tietosolu |
<td>solu1</td> |
<td>solu1 |
| solu | solu2 | ||||||
Tietosaulu | <td>solu1</td> <td>solu2</td> <td>solu3</td> | <td>solu1 <td>solu2 <td>solu3 | |solu1||solu2||solu3 | ||||||
Otsikkosolu | <th></th> | <th> | ! otsake | ||||||
Esimerkkitaulu |
| ||||||||
<table> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> | <table> <tr> <td> 1 <td> 2 <tr> <td> 3 <td> 4 </table> | {| | 1 || 2 |- | 3 || 4 |} | |||||||
Esimerkkitaulu |
| ||||||||
<table> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> <tr> <td>5</td> <td>6</td> </tr> </table> | <table> <tr> <td> 1 <td> 2 <tr> <td> 3 <td> 4 <tr> <td> 5 <td> 6 </table> | {| | 1 || 2 |- | 3 || 4 |- | 5 || 6 |} |
Galleria
- <gallery>-tagilla voidaan tuottaa kuvagalleriaa muistuttava taulukko:
<gallery> Drenthe Flevoland Friesland Gelderland Groningen Limburg North Brabant (capital: [[Den Bosch]]) North Holland Overijssel South Holland Utrecht Zeeland </gallery>
Yllä oleva listaus näyttää seuraavanlaiselta:
Drenthe Flevoland Friesland Gelderland Groningen Limburg North Holland Overijssel South Holland Utrecht Zeeland
Kelluva taulukko
Kelluva taulukko määritellän esim float=right. Normaalisti kelluvia taulukoita ei kannata käyttää, ne ovat häiritsevän näköisiä.
Tekstin tasaus, text align
HUOMAA: Align=right on taulukolle yleensä suuressa taulukossa huono valinta taulukon määritteisin, koska se siirtää kaiken taulukon jälkeen tulevan tekstin taulukon leveyden verran oikealle.
HTML-taulukon muuttaminen wikitaulukoksi
HTML-taulukon muuttaminen wikitaulukoksi onnistuu käsinkin mutta on työlästä touhua. Muuntaminen onnistuu helpoiten verkossa olevan muuntajan avulla. Se pyytää tekstiruutuun taulukon HTML:koodia (löytyy yleensä selaimen lähdekoodi-valikosta) ja antaa toiseen tekstiruutuun taulukon wikitaulu-esityksen, joka lisätään wikipedian sivulle. Joitain taulukkomuuntajia jotka muuntavat tauluja HTML:stä wikimuotoon on verkossa. Muuntamisen jälkeen taulukkoa voi siivota esim tavalllisella tekstinkäsittelyohjelmalla. Jotkut konvertterit tuottavat tarpeetonta roskaa wikitaulu-koodiin. Jos on esim ylimääräisiä <font size="+1">-tageja ja </font>-tageja, ne voi ottaa pois etsi-korvaa-toiminnalla. Näin wikitaulu tulee tiiviseen tilaan ja käyttää yleisiä fonttimäärityksiä.
Tämä näyttää varmimmalta:
Voi katsoa, vastaavatko nämä tarpeitasi:
- http://jannenau.50megs.com/codexyz/htwiki/hotwiki.html HotWiki poistaa värit ja fontit taulusta.
- http://www.cnic.org/html2mediawiki.html Nopea!
- http://diberri.dyndns.org/html2wiki.html
- http://area23.brightbyte.de/csv2wp.php
- http://www.wackyboy.com/ConvertHtmlTableToWikiTable.html
Ohjelma, joka vaihtaa wikitaulun sarakkeita
Koeohjelma, joka vaihtaa haluttaessa wikitaulun sarakkeita ja luo HTML-taulusta prettytable-tauluun. Ohjelma hävittää monet taulukon solujen määreet ja taustavärit sekä fontit. Vain colspan ja rowspan jäävät. Ohjelmaa käytetään komentoriviltä, eli ns. DOS-kehoitteesta ja siitä on myös Windows-versio. Ohjelmaa koskeva palaute osoitteeseen mailto:kiviapaja@hotmail.com (toivomukset, ehdotukset ja virheraportit). Ohjelma ei tue täysin läheskään kaikkia HTML:ssä olevia erilaisia taulukoita, mutta tekee useimmissa tapauksessa suurimman osan raskaasta muuntotyöstä ja siksi lienee hyödyllinen.
Ohjelmaan syötetään sisään html-koodi, jossa on yksi taulukko. Sisäänsyöttötiedoston on oltava puhdasta ASCII-tekstiä, ei esim. Wordin .DOCia.
ohjelman käyttö:
htwiki in.html
antaa out.txt:ssä wikitaulun.
HTWIKI:n "virallinen lataussivu":
Milloin taulukon tekeminen ei kannata
Kaksisarakkeisen taulukon teko ei yleensä kannata.
Älä tee näin
1980 Yksi 1988 Kaksi 1994 Kolme 1994 Neljä
Tee mieluummin näin
- 1980: Yksi
- 1988: Kaksi
- 1994: Kolme
- 1994: Neljä
Wikitable
Taulukon otsikkolohkoon lisättävä wikitable-luokka antaa taulukolle ulkoasun.
{| class="wikitable" |-