Főmenü megnyitása


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

Tartalomjegyzék

AlapszerkezetSzerkesztés

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álataSzerkesztés

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égSzerkesztés

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ágSzerkesztés

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ásaSzerkesztés

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ásSzerkeszté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

A táblázat középre igazításaSzerkesztés

Kód Megjelenés
{|width="250px" style="margin-left: auto; margin-right: auto;"
|-
|align="center"| AAA
|align="right"| BBB
|}
AAA BBB

Vertikális igazításSzerkeszté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ínSzerkesztés

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ásSzerkeszté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álataSzerkesztés

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íneSzerkesztés

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ílusaSzerkesztés

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ágaSzerkesztés

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íneSzerkesztés

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 egybenSzerkesztés

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 gyakorlatbanSzerkesztés

Széptáblázat sablon használataSzerkesztés

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éseSzerkesztés

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

Rendezhető táblázatSzerkesztés

{|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áSzerkesztés

Ha a szócikkünkben található ! jellel készített fejrész, akkor a táblázatba egyszerűen be lehet illesztenünk az mw-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="mw-collapsible" style="width:300px;" border="1"
! Nyitható és csukható táblázat
|-
| táblázat tartalma
|}
Nyitható és csukható táblázat
táblázat tartalma
  • A táblázat szélességét (300px, 100% stb.) mindenképpen meg kell adni, különben a táblázat csukott állapotban „összeugrik” a fejléc szélességére.
  • Ha alaphelyzetben zárt táblázatot szeretnél, akkor a classhoz írd ezt: mw-collapsible mw-collapsed.
  • Szebb táblázat érhető el, ha a wikitable collapsible osztályt használod.

Keretes írásokSzerkesztés

Ha jobbra vagy balra csúsztatott keretben szeretnél valamit megírni, akkor ezt a DIV és a keretjobb / keretbal segítségével teheted meg.

<div class="keretjobb">Ha jobbra vagy balra csúsztatott keretben szeretnél valamit megírni, akkor ezt a DIV és a keretjobb / keretbal segítségével teheted meg.</div>

Lásd mégSzerkesztés