Ajutor:Tabele

Comandă rapidă:
A:T

Această pagină oferă informații despre sintaxa construirii unor tabele wiki. Nu toate aceste exemple tehnice sunt 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.

Un tabel simplu

Deși codul HTML funcționează, recomandăm folosirea codurilor wiki pentru construirea tabelelor.

  • pentru a începe un tabel folosiți codul {| iar la sfârșit, codul |} .
{|  cod tabel|}
  • puteți include un titlu printr-o linie nouă cu bară verticală și semnul plus "|+" :
{||+ titlu  cod tabel|}
  • pentru a adăuga un rând nou, scrieți: "|-". Codul pentru celulele rândului va începe în linia următoare.
{||+ titlu tabel|-  cod celulă|-  cod celulă|}
  • scrieți codul pentru fiecare celulă din tabel în rândul următor, începând cu o bară verticală:
{||+ titlu tabel|-| cod celulă|-| cod celulă| mai multe celule în același rând|}
  • Celulele pot fi separate fie folosind o linie nouă și bare verticale fie folosind bare verticale duble "||" în aceeași linie. Ambele produc același rezultat:
{||+ titlu tabel|-|celulă 1 || celulă 2 || celulă 3|-|celulă A |celulă B|celulă C|}

Rezultat:

titlu tabel
celulă 1celulă 2celulă 3
celulă Acelulă Bcelulă C
  • un rînd pentru titlurile coloanelor se creează folosind "!" în loc de "|" și "!!" în loc de "||".
{||+ 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ă 1titlu coloană 2titlu coloană 3
celulă 1celulă 2celulă 3
celulă Acelulă Bcelulă C
  • prima celulă a rândului apare îngroșat dacă la începutul liniei se scrie "!" în loc de "|".
{||+ 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ă 1coloană 2coloană 3
titlu rând 1celulă 2celulă 3
titlu rând Acelulă Bcelulă C
  • Un parametru opțional poate modifica modul de afișare a celulelor, a rândurilor sau a întregului tabel. De exemplu, putem adăuga un chenar tabelului. Incrementați valoarea parametrului border și vedeți ce se întâmplă.
{| 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ă 1titlu coloană 2titlu coloană 3
titlu rând 1celulă 2celulă 3
titlu rând Acelulă Bcelulă C

Exemple

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 1celulă 2, rând 1
celulă 1, rând 2celulă 2, rând 2

Tabel înmulțiri

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
×123
1123
2246
3369
44812
551015

Culori; scopul parametrilor

Există două moduri de a specifica culoarea textului și a fundalului (background) 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

abcdef ghi jkl

Culorile pot fi specificate pentru un rând întreg sau pentru tot tabelul; parametrii pentru un rând sunt prioritari față de cei pentru tabel iar parametrii pentru celulă sunt 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

abcdefghi
jklmnopqr
stuvwxyz

Lățime, înălțime

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

abcdefghi
jklmnopqr
stuvwxyz

Lățimea unei coloane

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" |Jucător| width="225" align="center"|Țară|-|2006|Andrei Pavel|România|-|2006|Roger Federer|Elveția|}
AnJucătorȚară
2006Andrei PavelRomânia
2006Roger FedererElveția

Mixtură

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 titluAl doilea titlu
sus stânga 

partea dreaptă

jos stângajos mijloc
Un tabel într-un tabel

Două imagini Wikipedia

Exemple avansate

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 1Col 2, rând 1 (și 2)Col 3, rând 1
Col 1, rând 2Col 3, rând 2

Obs. că tabelul apare în dreapta. Acest paragraf apare după tabel. Lorem ipsum ...


Tabel în tabel

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

Folosire COLSPAN și ROWSPAN

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ă 1Coloană 2Coloană 3
AB
CD
EF
GHI
JK
L

Tabele centrate

Î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
Duisauteirure
dolorin reprehenderitin voluptate velit
esse cillum doloreeu fugiat nullapariatur.

Setarea parametrilor

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.

Cod Wiki

{| style="color:white"|-| bgcolor="red"|cell1 || width="300" bgcolor="blue"|cell2 || bgcolor="green"|cell3|}

Rezultat

cell1cell2cell3

Alinierea la zecimală

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

Clase

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:

{| border="1" cellpadding="2"|+Multiplication table|-! &times; !! 1 !! 2 !! 3|-! 1| 1 || 2 || 3|-! 2| 2 || 4 || 6|-! 3| 3 || 6 || 9|-! 4| 4 || 8 || 12|-! 5| 5 || 10 || 15|}
 
Multiplication table
×123
1123
2246
3369
44812
551015
devine asta:
{| class="wikitable"|+Multiplication table|-! &times; !! 1 !! 2 !! 3|-! 1| 1 || 2 || 3|-! 2| 2 || 4 || 6|-! 3| 3 || 6 || 9|-! 4| 4 || 8 || 12|-! 5| 5 || 10 || 15|}
 
Multiplication table
×123
1123
2246
3369
44812
551015

înlocuind parametrii tabelei (border="1" cellpadding="2") cu class="wikitable"

Alte sintaxe pentru tabele

Alte tipuri de sintaxă pentru tabele suportate de MediaWiki sînt:

  1. XHTML
  2. HTML și sintaxa wiki <td>

Notați totuși că thead, tbody, tfoot, colgroup și col în mod curent nu sunt suportate în MediaWiki.

Comparație

Comparația sintaxelor pentru tabele
 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>cell2</td>

<td>cell1
<td>cell2

| 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
1 2
3 4
<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
1 2
3 4
5 6
<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.
  • Poate fi previzualizat/elim. erori cu orice editor XHTML
  • Poate fi formatat pentru o citire mai ușoară
  • Bine cunoscut
  • Poate fi previzualizat/elim. erori cu orice editor HTML
  • Poate fi formatat pentru o citire mai ușoară
  • Bine cunoscut
  • Ocupă mai puțin spațiu decât XHTML
  • Ușor de scris
  • Ușor de citit
  • Ocupă puțin spațiu
Dezav.
  • Incomod
  • Ocupă mult spațiu
  • Greu de citit repede
  • Confuz, în special pentru oamenii care au puțină experiență HTML
  • E posibil să nu fie suportat de browser în viitor
  • Sintaxă nefamiliară
  • Structură rigidă
  • Nu este ușor de înțeles de către cei care nu sînt familiarizați cu conceptele HTML
 XHTML HTML & Wiki-td Wiki-bară verticală

Vezi și