Aide:Tableau

De Geneawiki
Aller à : navigation, rechercher

<- Retour Accueil de l'aide

Ces balises de tables, remplacent les traditionnelles balises HTML <table>, <tr>, <td>, <th> et <caption>. Les balises HTML peuvent cependant toujours être utilisées.

Les balises ci-dessous doivent commencer au début d'une ligne (sauf une exception). Les paramètres sont optionnels.


Les bases

Un exemple de tableau minimal :


gauche droite

et la méthode pour l'obtenir :


Résultat Syntaxe wikimédia autre méthode
gauche droite
 {| border="1"
 |gauche
 |droite
 |}
 {| border="1"
 |gauche||droite
 |}


Mais reprenons au début...



Tableau

Un tableau est défini par

{| ''paramètres''
 |}

Ce qui équivaut à

<table paramètres>
</table>
Attention: Vous devez obligatoirement laisser une espace entre {| et paramètre, sinon le premier paramètre sera ignoré.

TD

Les cellules sont créées soit comme ça :

|Cellule1
|Cellule2
|Cellule3

soit comme ça :

|Cellule1||Cellule2||Cellule3

les deux méthodes équivalent à :

<td>cellule1</td><td>cellule2</td><td>cellule3</td>

donc "||" est égal à "nouvelle ligne" + "|"

Les paramètres dans les cellules peuvent être utilisés comme ceci :

|params|cellule1||params|cellule2||params|cellule3

ce qui va donner :

<td params>

TH

Fonctionne de la même manière que TD, sauf que "!" est utilisé à la place du "|" ouvrant. "!!" peut remplacer "||". Les paramètres utilisent cependant toujours "|"!

TR

les balises <tr> vont être automatiquement générées pour la première ligne. Pour créer une autre ligne, faites :

|-

ou

|--------------

ou

|-------------------

les trois correspondent à :

<tr>

Les paramètres peuvent être ajoutés comme ça :

|- paramètres

Ou

|------- paramètres

ce qui équivaut à :

<tr params>

Note :

  • les balises <tr> sont automatiquement ouvertes à l'apparition du premier <td>.
  • les balises <tr> sont automatiquement fermées à l'apparition de <tr> ou de </table>.

Légende

Une balise de <légende> est créée par

|+ Légende

Qui donnera

<caption>Légende</caption>

Vous pouvez aussi utiliser des paramètres :

|+ paramètres|Légende

Qui donnera

<caption paramètres>Légende</caption>

Exemples

Exemple simple

 {| 
 | Cellule 1, ligne 1 
 | Cellule 2, ligne 1 
 |- 
 | Cellule 1, ligne 2 
 | Cellule 2, ligne 2 
 |}

générera

Cellule 1, ligne 1 Cellule 2, ligne 1
Cellule 1, ligne 2 Cellule 2, ligne 2

Exemple plus compliqué

{| align=right border=1
| Cellule 1, ligne 1 
|rowspan=2| Cellule 2, ligne 1 (et 2) 
| Cellule 3, ligne 1 
|- 
| Cellule 1, ligne 2 
| Cellule 3, ligne 2 
|}

On remarquera que le tableau est collé sur le bord droit de la page.

Cellule 1, ligne 1 Cellule 2, ligne 1 (et 2) Cellule 3, ligne 1
Cellule 1, ligne 2 Cellule 3, ligne 2


Tableau imbriqué

 {| border=1
 | blabla
 |
 {| border=2
 |- bgcolor="#abcdef"
 |tableau imbriqué
 |- bgcolor="#abcdef"
 |tableau
 |}
 |Le tableau parent
 |}

Nous présente un tableau imbriqué

blabla
tableau imbriqué
tableau
Le tableau parent

Légende et cellules multi-lignes

Ceci est la légende
Indépendance 19 août 1919
Monnaie Afghani
Time zone UTC+4:30
Hymne national Sououd-e-Melli
Internet TLD .AF
{| border=1 align=right
|+ '''Ceci est la légende'''.
|[[Indépendance]]||[[19 août]] [[1919]]
|-
|[[Monnaie]]||[[Afghani]]
|-
|[[Time zone]]||[[Temps universel coordonné|UTC]]+4:30
|-
|[[Hymne national]]||[[Sououd-e-Melli]]
|-
|[[Top-level domain|Internet TLD]]||.AF
|}

est montré à droite.

Tableau avec titre

{| border=1
! titre1!! titre2
|-
| Cellule1|| Cellule2
|}

donne

titre1 titre2
Cellule1 Cellule2

Classement alphanumérique (triable)

Chaque contenu des colonnes peut être en ordre alphabétique ou numérique en cliquant sur l'un des symboles, à droite du texte des premières cellules, dans la première ligne du tableau. Les informations des autres colonnes seront réorganisées en conséquence.

1ère colonne 2ème colonne 3ème colonne 4ème colonne
Alpha Lettre A Bleu 10
Beta Lettre B Jaune 15
Gamma Lettre C Rouge 20
Delta Lettre D Vert 5

Ligne avec titre et contenu mélangés

  {| border=1 cellspacing=0
 ! 
 ! Header1 
 ! Header2 
 |-
 ! row a
 | cel a1
 | cel a2
 |-
 ! Row b
 | cel b1
 | cel b2 
 |}

donne:

Header1 Header2
row a cel a1 cel a2
Row b cel b1 cel b2

mais:

 {| border=1 cellspacing=0
 ! !! col Header1 !! Header2 
 |-
 ! row header A || cel a1 ||   cel a2
 |-
 ! RH B         || cel b1 ||    cel b2
 |}

donne:

col Header1 Header2
row header A cel a1 cel a2
RH B cel b1 cel b2

On peut aussi éviter de coller le contenu au bord des cellules

 {| border=1 cellspacing=0 cellpadding=4
 ! !! col Header1 !! Header2 
 |-
 ! row header A || cel a1 ||   cel a2
 |-
 ! RH B         || cel b1 ||    cel b2
 |}

donne:

col Header1 Header2
row header A cel a1 cel a2
RH B cel b1 cel b2