Entête 1 | Entête 2 | Entête 3 |
---|---|---|
Cellule 1-1 | Cellule 1-2 | Cellule 1-3 |
Cellule 2-1 | Cellule 2-2 | Cellule 2-3 |
Cellule 3-1 | Cellule 3-2 | Cellule 3-3 |
Pour cela, il faut combiner les bbcodes suivants :
- table représentant le tableau global
- tr représentant une ligne du tableau
- td représentant une cellule d'une ligne de tableau
- th représentant une cellule avec un style différent, généralement utilisé pour les entêtes des colonnes (ligne à fond noir et texte blanc dans l'exemple ci-dessus).
Pour ceux qui connaissent les tables HTML, c'est donc le même principe.
Le texte pour créer le tableau ci-dessus est le suivant :
- Code: Tout sélectionner
[table][tr][th]Entête 1[/th][th]Entête 2[/th][th]Entête 3[/th][/tr][tr][td]Cellule 1-1[/td][td]Cellule 1-2[/td][td]Cellule 1-3[/td][/tr][tr][td]Cellule 2-1[/td][td]Cellule 2-2[/td][td]Cellule 2-3[/td][/tr][tr][td]Cellule 3-1[/td][td]Cellule 3-2[/td][td]Cellule 3-3[/td][/tr][/table]
Attention ! Il ne faut pas mettre de retour à la ligne entre les fermetures et ouvertures de ces bbcodes, sinon ces retours à la ligne apparaitront tous avant le tableau. L'exemple suivant causera l'affichage de 4 lignes vides avant le tableau, à cause des retours à la ligne entre la fermeture d'un tr ou d'un td et l'ouverture du suivant, et d'un autre avant la fermeture de la table :
- Code: Tout sélectionner
[table][tr][th]Entête 1[/th][th]Entête 2[/th][th]Entête 3[/th][/tr]
[tr][td]Cellule 1-1[/td][td]Cellule 1-2[/td][td]Cellule 1-3[/td]
[/tr][tr][td]Cellule 2-1[/td][td]Cellule 2-2[/td]
[td]Cellule 2-3[/td][/tr]
[/table]
Par contre évidemment vous pouvez mettre des retours à la ligne dans les textes à l'intérieur des cellules td ou th, y compris entre deux bbcodes b et i par exemple
- Code: Tout sélectionner
[table][tr][td][b]Cellule[/b]
[i]1-1[/i][/td][/tr][/table]
Par défaut le tableau est aligné à gauche, mais il est possible de le centrer ou de l'aligner à droite en ajoutant "center" ou "right" au bbcode table :
- Code: Tout sélectionner
[table=center]...[/table]
[table=right]...[/table]
A l'intérieur des cellules, vous pouvez mettre ce que vous voulez, y compris des bbcodes "center" ou "right" pour centrer ou aligner à droite le contenu de la cellule :
Entête 1 | Entête 2 | Entête 3 |
---|---|---|
Cellule 1-1 | Cellule 1-2 | Cellule 1-3 |
Cellule 2-1 | Cellule 2-2 | Cellule 2-3 |
Cellule 3-1 | Cellule 3-2 | Cellule 3-3 |
- Code: Tout sélectionner
[table=center][tr][th]Entête 1[/th][th][center]Entête 2[/center][/th][th][right]Entête 3[/right][/th][/tr][tr][td]Cellule 1-1[/td][td][center]Cellule 1-2[/center][/td][td][right]Cellule 1-3[/right][/td][/tr][tr][td]Cellule 2-1[/td][td][center]Cellule 2-2[/center][/td][td][right]Cellule 2-3[/right][/td][/tr][tr][td]Cellule 3-1[/td][td][center]Cellule 3-2[/center][/td][td][right]Cellule 3-3[/right][/td][/tr][/table]
Il est également possible de définir une largeur pour une ou plusieurs colonnes en ajoutant un nombre au td ou th correspondant de la première ligne :
Entête 1 | Entête 2 | Entête 3 |
---|---|---|
Cellule 1-1 | Cellule 1-2 | Cellule 1-3 |
Cellule 2-1 | Cellule 2-2 | Cellule 2-3 |
Cellule 3-1 | Cellule 3-2 | Cellule 3-3 |
- Code: Tout sélectionner
[table][tr][th=250]Entête 1[/th][th]Entête 2[/th][th=100]Entête 3[/th][/tr][tr][td]Cellule 1-1[/td][td]Cellule 1-2[/td][td]Cellule 1-3[/td][/tr][tr][td]Cellule 2-1[/td][td]Cellule 2-2[/td][td]Cellule 2-3[/td][/tr][tr][td]Cellule 3-1[/td][td]Cellule 3-2[/td][td]Cellule 3-3[/td][/tr][/table]