Wikipédia:Táblázatok

Rövidítése:
WP:TÁ

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ó.

Alapszerkezet

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 |}	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

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"

• sorra vonatkozólag:

|-paraméternév="érték"

• cellára vonatkozólag:

|paraméternév="érték"| (tartalom)

• fejlécre vonatkozólag:

!paraméternév="érték"| fejléc

• táblázatcímre vonatkozólag:

|+paraméternév="érték"| táblacím

Szélesség

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 |}	AAA BBB
{| |- |width="50px"| CCC |width="100px"| DDD |}	CCC DDD

Magasság

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 |}	AAA BBB

Sorok és oszlopok összekapcsolása

Több oszlop egyben Paraméter neve: colspan Maximális érték Példa oszlopok száma 3

Több sor egyben Paraméter neve: rowspan Maximális érték Példa sorok száma 3

Kód	Megjelenés
{| |- |colspan="2"| AAA |- | CCC | DDD |}	AAA CCC DDD
{| |- |rowspan="2"| AAA | BBB |- | DDD |}	AAA BBB DDD

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 |}	AAA BBB

Vertikális igazítás

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 |}	AAA BBB CCC DDD

Háttérszín

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 |}	AAA BBB CCC DDD

Egyirányú vonalazás

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 |}	AAA BBB CCC DDD
{|rules=cols border=1 |- | AAA | BBB |- | CCC | DDD |}	AAA BBB CCC DDD

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 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.

Szöveg színe

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 |}	AAA BBB

Keret stílusa

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 |}	AAA
{|style="border-style: dashed;" | BBB |}	BBB
{|style="border-style: double;" | CCC |}	CCC
{|style="border-style: solid;" | DDD |}	DDD

Keret vastagsága

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 |}	AAA
{|style="border-style: solid; border-width: 5px;" | BBB |}	BBB

Keret színe

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 |}	AAA
{|style="border-style: solid; border-color: #2E8B57;" | BBB |}	BBB

Keret minden tulajdonsága egyben

Attribútum neve: border

Ez az attribútum egyszerre 3 értéket fogad el, melyeket a következő sorrendben kell megadni:

1. border-width (vastagság)

2. border-style (stílus)

3. border-color (szín)

Kód	Megjelenés
{|style="border:thick inset Magenta;" | AAA |}	AAA
{|style="border:5px outset #000080;" | BBB |}	BBB

A gyakorlatban

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 rövidítése

Kód	Megjelenés
{| |- |AAA||BBB||CCC |}	AAA BBB CCC

Rendezhető táblázat

{|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 data-sort-value="eredeti szám" attribútummal (pl. | data-sort-value="1234" | 1234<ref>lábjegyzet</ref> formában), akkor az ott megadott számérték alapján rendez

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 rendezési kulcsot adjunk meg, ahol az első karakter 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ű).

Táblázat átalakítása kinyithatóvá

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 (ha nem, akkor be kell szúrni egyet, ami a táblázat teljes szélességével egyenlő szélességű – ld. colspan):

{|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.

Lásd még

• {{széptáblázat-r}}^(?) – rendezhető változat
• Angol nyelvű ismertető
• ‎‎HTML-színkódok