A táblázatokat a Wikipédiában kétféle módon lehetséges elkészíteni: HTML kóddal, vagy a Wikipedia saját jelölőnyelvével. Azonban szinte mindenhol az utóbbit használjuk, ugyanis ez sokkal rövidebb és átláthatóbb, mint a HTML változat. Ezen az oldalon ennek a jelölőnyelvnek a használatát ismerheted meg.
A különféle színezések használatakor kérjük, vedd figyelembe, hogy enciklopédiát írunk! A fölösleges és rikító színezéseket és keretvastagságokat kerülni kell. Szerkesztői lapon természetesen szabadon alkalmazható.
- Megjegyzés: az alábbi példákban egy sablont, nevezetesen a
{{Széptáblázat}}(?) nevűt alkalmazzuk a megértés megkönnyítésére. Részletesebben a sablon használatáról lásd lentebb.
Minden táblázat az alábbi két jel (négy karakter) közé ékelődik:
{|
|}
Magát a táblázatot a következőképpen lehet felépíteni: A |- jelek egy új sort jeleznek. Ezek alatt helyezkednek el annak az adott sornak a cellái (vagyis az oszlopok). A tartalom | jelek után következik.
Íme egy egyszerű példa:
| Kód |
Megjelenés |
{|
|-
| AAA
| BBB
|-
| CCC
| DDD
|}
|
|
Lehetőség van arra is, hogy a táblázatot egy címmel, illetve fejlécekkel lássuk el. Ezeknek igazából csak a formázás szempontjából van értelme. Cím készítése:
|+cím
Fejléc készítése:
!fejléc
| Kód |
Megjelenés |
{|
|+cím
!első fejléc
!második fejléc
|-
| AAA
| BBB
|-
| CCC
| DDD
|}
|
cím
| első fejléc |
második fejléc |
| AAA |
BBB |
| CCC |
DDD |
|
[szerkesztés] Paraméterek használata
- Megjegyzés: az alábbi példákban egy sablont, nevezetesen a
{{Széptáblázat}}(?) nevűt alkalmazzuk a megértés megkönnyítésére. Részletesebben a sablon használatáról lásd lentebb.
A táblázat minden elemének meg lehet adni egy vagy több paramétert. Ezekkel különféle módosításokat lehet elvégezni a kinézeten. A paraméterek megadása a következőképpen történik:
paraméternév="érték"
Az értéket nem kötelező idézőjelek közé tenni, de általában ajánlott, mert pl. ha az érték szóközt is tartalmaz, akkor a program rosszul értelmezi azt. Két paramétert szóközzel lehet elválasztani egymástól.
A paramétereket az alábbi módokon lehet megadni:
- a tábla egészére vonatkozólag:
{|paraméternév="érték"
|-paraméternév="érték"
|paraméternév="érték"| (tartalom)
!paraméternév="érték"| fejléc
- táblázatcímre vonatkozólag:
|+paraméternév="érték"| táblacím
Paraméter neve: width
| Lehetséges értékek |
Példa |
| a felhasználható terület adott százaléka |
50% |
| pixel (képpont) |
250px |
Megjegyzés: egy cella módosítása az oszlopban lévő összes többi cella szélességét is megváltoztatja.
| Kód |
Megjelenés |
{| width="100%"
|-
| AAA
| BBB
|}
|
|
{|
|-
|width="50px"| CCC
|width="100px"| DDD
|}
|
|
Paraméter neve: height
| Lehetséges értékek |
Példa |
| pixel (képpont) |
250px |
Megjegyzés: csak cellákon alkalmazható, de egy cella módosítása a sorban lévő összes többi cella magasságát is megváltoztatja.
| Kód |
Megjelenés |
{|
|-
|height="80px"| AAA
| BBB
|}
|
|
[szerkesztés] Sorok és oszlopok összekapcsolása
Paraméter neve: colspan
| Lehetséges értékek |
Példa |
| oszlopok száma |
3 |
|
Paraméter neve: rowspan
| Lehetséges értékek |
Példa |
| sorok száma |
3 |
|
| Kód |
Megjelenés |
{|
|-
|colspan="2"| AAA
|-
| CCC
| DDD
|}
|
|
{|
|-
|rowspan="2"| AAA
| BBB
|-
| DDD
|}
|
|
[szerkesztés] Horizontális igazítás
Paraméter neve: align
| Lehetséges értékek |
Magyarul |
| left |
balra (alapértelmezett) |
| right |
jobbra |
| center |
középre |
| justify |
sorkizárt |
| Kód |
Megjelenés |
{|width="250px" align="right"
|-
|align="center"| AAA
|align="right"| BBB
|}
|
|
Paraméter neve: valign
| Lehetséges értékek |
Magyarul |
| top |
felülre |
| middle |
középre |
| bottom |
alulra |
| baseline |
minden betű alja (függetlenül méretétől) egy adott vonalra sorakozik fel |
| Kód |
Megjelenés |
{|
|-
|height="100px" width="100px"| AAA
|valign="top" width="100px"| BBB
|-
|valign="middle" height="100px"| CCC
|valign="bottom"| DDD
|}
|
|
Paraméter neve: bgcolor
| Lehetséges értékek |
Példa |
| # és egy hexadecimális színkód (lista itt) |
#FF0000 |
| szín angol neve (lista itt) |
blue |
| Kód |
Megjelenés |
{| width="100%"
|-bgcolor="Aqua"
| AAA
| BBB
|-
|bgcolor="green"| CCC
|bgcolor="#FF8C00"| DDD
|}
|
|
Paraméter neve: rules
| Lehetséges értékek |
Magyarul |
| rows |
sorok |
| cols |
oszlopok |
| Kód |
Megjelenés |
{|rules=rows border=1
|-
| AAA
| BBB
|-
| CCC
| DDD
|}
|
|
{|rules=cols border=1
|-
| AAA
| BBB
|-
| CCC
| DDD
|}
|
|
[szerkesztés] A style paraméter használata
A style paraméter lényege, hogy ún. Cascading Style Sheets (CSS) stílusdefiníciókat adhatunk hozzá a formázandó objektumhoz. Ezek megadása a következőképpen a következőképpen történik:
style="attribútum1: érték1; attribútum2: érték2;"
Az attribútum a módosítandó kívánt formázásnak az angol neve.
Attribútum neve: color
| Lehetséges értékek |
Példa |
| # és egy hexadecimális színkód (lista itt) |
#FF0000 |
| szín angol neve (lista itt) |
blue |
| Kód |
Megjelenés |
{|
|-
|style="color: red;"| AAA
|style="color: #FF00FF;"| BBB
|}
|
|
Attribútum neve: border-style
| Lehetséges értékek |
Magyarul |
| none |
nincs keret |
| solid |
sima vonal |
| dotted |
pontokból álló vonal |
| dashed |
szaggatott vonal |
| double |
dupla vonal |
| groove |
3D behúzott |
| ridge |
3D kihúzott |
| inset |
3D benyomott |
| outset |
3D kiemelt |
| Kód |
Megjelenés |
{|style="border-style: dotted;"
| AAA
|}
|
|
{|style="border-style: dashed;"
| BBB
|}
|
|
{|style="border-style: double;"
| CCC
|}
|
|
{|style="border-style: none;"
| DDD
|}
|
|
Attribútum neve: border-width
| Lehetséges értékek |
Példa |
| 3 előre meghatározott vastagság |
thin (vékony), medium (közepes), thick (vastag) |
| pixel (képpont) |
5px |
Fontos: a megfelelő működéshez a border-style attribútumot is meg kell adni.
| Kód |
Megjelenés |
{|style="border-style: solid; border-width: thin;"
| AAA
|}
|
|
{|style="border-style: solid; border-width: 5px;"
| BBB
|}
|
|
Attribútum neve: border-color
| Lehetséges értékek |
Példa |
| # és egy hexadecimális színkód (lista itt) |
#FF0000 |
| szín angol neve (lista itt) |
blue |
Fontos: a megfelelő működéshez a border-style attribútumot is meg kell adni.
| Kód |
Megjelenés |
{|style="border-style: solid; border-color: SteelBlue;"
| AAA
|}
|
|
{|style="border-style: solid; border-color: #2E8B57;"
| BBB
|}
|
|
[szerkesztés] Keret minden tulajdonsága egyben
| Kód |
Megjelenés |
{|style="border:thick inset Magenta;"
| AAA
|}
|
|
{|style="border:5px outset #000080;"
| BBB
|}
|
|
[szerkesztés] Széptáblázat sablon használata
A táblázat első sorában használhatjuk a {{Széptáblázat}}(?) sablont, s ekkor egységesek lesznek a táblázataink.
{| {{széptáblázat}}
! oszlop fejléc 1
! oszlop fejléc 2
|-
| 1. sor, 1. oszlop
| 1. sor, 2. oszlop
|-
| 2. sor, 1. oszlop
| 2. sor, 2. oszlop
|}
| oszlop fejléc 1 |
oszlop fejléc 2 |
| 1. sor, 1. oszlop |
1. sor, 2. oszlop |
| 2. sor, 1. oszlop |
2. sor, 2. oszlop |
| Kód |
Megjelenés |
{|
|-
|AAA||BBB||CCC
|}
|
|
{|class="sortable" border="1" style="width:50%; background:FloralWhite; border: solid 0.5px; "
!colspan=2|demo1
|-
|| 9 || kilenc
|-
||11 || tizenegy
|-
||12 || tizenkettő
|-
||1 || egy
|}
| demo1 |
| 9 |
kilenc |
| 11 |
tizenegy |
| 12 |
tizenkettő |
| 1 |
egy |
{|class="sortable" border="1" style="width:50%; background:FloralWhite; border: solid 0.5px; "
|+ demo2
!|számokkal||betűvel
|-
|| 9 || kilenc
|-
||11 || tizenegy
|-
||12 || tizenkettő
|-
||1 || egy
|}
demo2
| számokkal |
betűvel |
| 9 |
kilenc |
| 11 |
tizenegy |
| 12 |
tizenkettő |
| 1 |
egy |
Ha a számok mögé valamilyen egyéb jel vagy betű kerül (pl. lábjegyzet miatt), a rendezés nem fog megfelelően működni, mert a program figyelmen kívül hagyja a helyi értéket (a 100, 200, 1000 sorozat pl. 100, 1000, 200 formában lesz rendezve, mivel az 1 megelőzi a 2-est). Ha az adott egyéb jelet, betűt nem akarjuk eltávolítani, akkor a <font color=white>0</font> megoldással láthatatlan 0-kat tehetünk a számok elé, hogy mindegyik ugyanannyi jegyből álljon, így a sima betűrendes rendezés is a számértéknek megfelelő sorrendet fog kiadni.
Ha az oszlop némelyik cellájában a szám helyén valami egyéb jel szerepel (pl. kihúzás, kérdőjel), és azt szeretnénk, ha ezek a legkisebb értékű szám mögött állnának, akkor olyan karaktert tehetünk be ezek elé láthatatlanul (fehér színnel), amelynek kódja kisebb a 0-énál (l. ASCII). Tekintve, hogy számokról van szó, érdemes ilyenkor # számjelet tenni ezek elé, s egyúttal ez az egyik legalacsonyabb kódszámú karakter is.
További lehetőségekért lásd a m:Help:Sorting lapot (angol nyelvű).
[szerkesztés] Táblázat átalakítása kinyithatóvá
Ahhoz, hogy a táblázat nyitható és csukható legyen, a következő átalakítást végezthetjük el a nagyméretű táblázatokon:
1. Az eddigi táblázat elé kerül:
<div style="clear:both;" class="NavFrame">
<div class="NavHead"><small>A táblázat a baloldai szövegre kattintva nyitható/csukható</small></div>
<div class="NavContent">
A <small></small> közötti szöveg tetszőlegesen változtatható, akár a <small></small> is elhagyható. Ekkor normál betűméretben látható a beírt szöveg.
2. A táblázatban megszűnik az eddigi címsor, tehát nincs már „|+”
3. A kinyitható táblázat lezárása következik ezután:
</div>
</div>
Példák kinyitható táblázatra a →ebben a cikkben találhatóak.
Ha a szócikkünkben található ! jellel készített fejrész, akkor a táblázatba egyszerűen be lehet illesztenünk a "collapsible" CSS-osztályt, az alábbi módon:
{|class="collapsible" border="1" width="300"
! Nyitható és csukható táblázat
|-
| táblázat tartalma
|}
| Nyitható és csukható táblázat |
| táblázat tartalma |
- Ha alaphelyzetben zárt táblázatot szeretnél, akkor a classhoz írd ezt: "collapsible collapsed".
- Szebb táblázat érhető el, ha a "toccolours collapsible" osztályt használod.