Această pagină oferă informaţii despre sintaxa construirii unor tabele wiki. Nu toate aceste exemple tehnice sînt potrivite pentru articole; folosirea culorilor pentru background-ul tabelelor nu este o idee foarte bună.
Pentru instrucţiunile generale de construite a tabelelor vezi Wikipedia:Folosirea tabelelor
Încercaţi să scrieţi tabele relativ simple --nu uitaţi că şi alţi contribuitori vor modifica articolul! Folosiţi Wikipedia:Cutia cu nisip pentru teste.
Cuprins |
Deşi codul HTML funcţionează, recomandăm folosirea codurilor wiki pentru construirea tabelelor.
{| iar la sfîrşit, codul |} .{| cod tabel |}
|+" :
{|
|+ titlu
cod tabel
|}
|-". Codul pentru celulele rîndului va începe în linia următoare.
{|
|+ titlu tabel
|-
cod celulă
|-
cod celulă
|}
{|
|+ titlu tabel
|-
| cod celulă
|-
| cod celulă
| mai multe celule în acelaşi rînd
|}
{|
|+ titlu tabel
|-
|celulă 1 || celulă 2 || celulă 3
|-
|celulă A
|celulă B
|celulă C
|}
Rezultat:
titlu tabel celulă 1 celulă 2 celulă 3 celulă A celulă B celulă C
{|
|+ titlu tabel
! titlu coloană 1 !! titlu coloană 2 !! titlu coloană 3
|-
|celulă 1 || celulă 2 || celulă 3
|-
|celulă A
|celulă B
|celulă C
|}
Rezultat:
titlu tabel titlu coloană 1 titlu coloană 2 titlu coloană 3 celulă 1 celulă 2 celulă 3 celulă A celulă B celulă C
{|
|+ titlu tabel
! titlu coloană 1 !! titlu coloană 2 !! titlu coloană 3
|-
! titlu rînd 1
| celulă 2 || celulă 3
|-
! titlu rînd A
|celulă B
|celulă C
|}
Rezultat:
titlu tabel titlu coloană 1 coloană 2 coloană 3 titlu rînd 1 celulă 2 celulă 3 titlu rînd A celulă B celulă C
{| border="1"
|+ titlu tabel
! titlu coloană 1 !! titlu coloană 2 !! titlu coloană 3
|-
! titlu rînd 1
| celulă 2 || celulă 3
|-
! titlu rînd A
|celulă B ||celulă C
|}
Rezultat:
titlu tabel titlu coloană 1 titlu coloană 2 titlu coloană 3 titlu rînd 1 celulă 2 celulă 3 titlu rînd A celulă B celulă C
Ambele coduri generează acelaşi rezultat.
Cod Wiki
{|
| celulă 1, rînd 1
| celulă 2, rînd 1
|-
| celulă 1, rînd 2
| celulă 2, rînd 2
|}
{|
| celulă 1, rînd 1 || celulă 2, rînd 1
|-
| celulă 1, rînd 2 || celulă 2, rînd 2
|}
Rezultat
celulă 1, rînd 1 celulă 2, rînd 1 celulă 1, rînd 2 celulă 2, rînd 2
Cod Wiki
{| class="wikitable" style="text-align:center"
|+Tabel înmulţiri
|-
! × !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}
Rezultat
Tabel înmulţiri × 1 2 3 1 1 2 3 2 2 4 6 3 3 6 9 4 4 8 12 5 5 10 15
Există două moduri de a specifica culoarea textului şi a background-ului pentru o singură celulă. Este recomandată prima formă.
Cod Wiki
{|
| style="background:red; color:white" | abc
| def
| bgcolor="red" | <font color="white"> ghi </font>
| jkl
|}
Rezultat
abc def ghi jkl
Culorile pot fi specificate pentru un rînd întreg sau pentru tot tabelul; parametrii pentru un rînd sînt prioritari faţă de cei pentru tabel iar parametrii pentru celulă sînt prioritari faţă de cei pentru rînd:
Cod Wiki
{| style="background:yellow; color:green"
|-
| abc
| def
| ghi
|- style="background:red; color:white"
| jkl
| mno
| pqr
|-
| stu
| style="background:silver" | vwx
| yz
|}
Rezultat
abc def ghi jkl mno pqr stu vwx yz
Puteţi specifica lăţimea şi înălţimea unui tabel la fel ca şi înălţimea unui rînd. Dacă lăţimea nu este specificată pentru toate coloanele şi/sau înălţimea nu este specificată pentru toate rîndurile, atunci e posibil să apară unele ambiguităţi şi rezultatul depinde de browser.
Cod Wiki
{| style="width:75%; height:200px" border="1"
|-
| abc
| def
| ghi
|- style="height:100px"
| jkl
| style="width:200px" |mno
| pqr
|-
| stu
| vwx
| yz
|}
Rezultat
abc def ghi jkl mno pqr stu vwx yz
Dacă vreţi să folosiţi un tabel în care coloanele au lăţimi diferite, urmăriţi acest exemplu. Atenţie: "!" îngroaşă textul; "width" este necentrat.
Cod Wiki
{| border="1" cellpadding="2"
! width="50"|An
| width="225" |Effect
| width="225" align="center"|Games Found In
|-
|2006
|Andrei Pavel
|România
|-
|2006
|Roger Federer
|Elveţia
|}
An Jucător Ţară 2006 Andrei Pavel România 2006 Roger Federer Elveţia
Puteţi încerca la Wikipedia:Cutia cu nisip tot felul de setări pentru propriul dumneavoastră tabel să vedeţi ce efect are.
Cod Wiki
{| border="1" cellpadding="5" cellspacing="0" align="center"
|+'''Aici apare titlul tabelului'''
|-
! style="background:#efefef;" | Primul titlu
! colspan="2" style="background:#ffdead;" | Al doilea titlu
|-
| sus stînga
|
| rowspan=2 style="border-bottom:3px solid grey;" valign="top" |
partea dreaptă
|-
| style="border-bottom:3px solid grey;" | jos stînga
| style="border-bottom:3px solid grey;" | jos mijloc
|-
| colspan="3" align="center" |
{| border="0"
|+''Un tabel într-un tabel''
|-
| align="center" width="150px" | [[Imagine:wiki.png]]
| align="center" width="150px" | [[Imagine:wiki.png]]
|-
| align="center" colspan="2" style="border-top:1px solid red; border-right:1px
solid red; border-bottom:2px solid red; border-left:1px solid red;" |
Două imagini Wikipedia
|}
|}
Rezultat
Aici apare titlul tabelului Primul titlu Al doilea titlu sus stînga partea dreaptă
jos stînga jos mijloc
Un tabel într-un tabel Două imagini Wikipedia
Acest paragraf apare înaintea tabelului. Lorem ipsum ...
'''Cod Wiki'''
{| align="right" border="1"
| Col 1, rînd 1
|rowspan="2"| Col 2, rînd 1 (şi 2)
| Col 3, rînd 1
|-
| Col 1, rînd 2
| Col 3, rînd 2
|}
Obs. că tabelul apare în dreapta. Acest paragraf apare după tabel. Lorem ipsum ...
Rezultat
Acest paragraf apare înaintea tabelului. Lorem ipsum ...
Col 1, rînd 1 Col 2, rînd 1 (şi 2) Col 3, rînd 1 Col 1, rînd 2 Col 3, rînd 2 Obs. că tabelul apare în dreapta. Acest paragraf apare după tabel. Lorem ipsum ...
Acest exemplu arată un tabel (în albastru) în interiorul altui tabel.
Cod Wiki
{| border="1"
| α
| align="center" | celula 2
{| border="2" style="background-color:#ABCDEF;"
| TABEL
|-
| ÎN TABEL
|}
| valign="bottom" | tabelul original din nou
|}
Rezultat
α celula 2
TABEL ÎN TABEL tabelul original din nou
Cod Wiki
{| border="1" cellpadding="5" cellspacing="0"
|-
! Coloană 1 || Coloană 2 || Coloană 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
|}
Rezultat
Coloană 1 Coloană 2 Coloană 3 A B C D E F G H I J K L
În cazul acestor tabele, textul nu va apărea nici în stînga nici în dreapta lor. Trucul este {| style="margin: 1em auto 1em auto"
Cod Wiki
{| class="wikitable" style="margin: 1em auto 1em auto"
|+ '''Tabel centrat, celule aliniate la stînga'''
! Duis || aute || irure
|-
| dolor || in reprehenderit || in voluptate velit
|-
| esse cillum dolore || eu fugiat nulla || pariatur.
|}
Rezultat
Tabel centrat, celule aliniate la stînga Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
La începutul celulei, adăugaţi parametrul urmat de o singură bară verticală. De exemplu, width=300px| va seta celula la o înălţime de 300 de pixeli. Pentru a seta mai mult de un parametru, lăsaţi un spaţiu între fiecare.
{| style="color:white"
|-
| bgcolor="red"|cell1 || width="300" bgcolor="blue"|cell2 || bgcolor="green"|cell3
|}
cell1 cell2 cell3
Cod Wiki
{|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
|}
|}
Rezultat
432 ,1
43 ,21
4 ,321
Unii utilizatori au creat clase CSS şi formate pentru a uşura folosirea tabelelor. În loc să ţineţi minte parametrii tabelei trebuie să includeţi o clasă potrivită după {|. De exemplu, asta:
|
|
|||||||||||||||||||||||||
| devine asta: | ||||||||||||||||||||||||||
|
|
|||||||||||||||||||||||||
înlocuind parametrii tabelei (border="1" cellpadding="2") cu class="wikitable"
Alte tipuri de sintaxă pentru tabele suportate de MediaWiki sînt:
Notaţi totuşi că thead, tbody, tfoot, colgroup şi col în mod curent nu sînt suportate în MediaWiki.
| XHTML | HTML & Wiki-td | Wiki-bară verticală | |||||||
|---|---|---|---|---|---|---|---|---|---|
| Tabel | <table></table> | <table></table> |
{| params
|}
|
||||||
| Titlu | <caption></caption> | <caption></caption> |
|+ caption |
||||||
| Rînd | <tr></tr> | <tr> |
|- params |
||||||
| Celulă |
<td>cell1</td> |
<td>cell1 |
| cell1 | cell2 |
||||||
| Celulă | <td>cell1</td> <td>cell2</td> <td>cell3</td> | <td>cell1 <td>cell2 <td>cell3 |
|cell1||cell2||cell3 |
||||||
| Titlu celulă | <th></th> | <th> |
! heading |
||||||
| Tabel simplu |
|
||||||||
<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
|}
|
|||||||
| Tabel simplu |
|
||||||||
<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
|}
|
|||||||
| Av. |
|
|
|
||||||
| Dezav. |
|
|
|
||||||
| XHTML | HTML & Wiki-td | Wiki-bară verticală | |||||||