Aide:Insérer un tableau/Mise en forme
Cette dernière partie nous permettra de voir en détails plusieurs codes particuliers, qui seront utilisés pour définir l'agencement de tableaux plus complexes.
N'hésitez pas à revenir souvent ici pour vous remémorer les différents codes et leurs fonctions.
Alignement d'un tableau[modifier]
Un tableau peut être aligné en inscrivant le code align="xxx" sur la ligne d'ouverture d'un tableau ( {| ).
Ainsi, en tapant :
align="left", le tableau est aligné sur la gauche du texte ;align="center", le tableau est aligné au centre ;align="right", le tableau est aligné à droite.
Exemple[modifier]
| Qui a été aligné à droite du texte. |
| Comme je l'ai demandé ! |
Le tableau apparaissant sur la droite a été obtenu en tapant ce code :
{| class="tableaustandard" align="right"
|+ Voici mon tableau
|-
| Qui a été aligné à droite du texte.
|-
| Comme je l'ai demandé !
|}
Définir la présentation des cellules[modifier]
Les cases d'un tableau sont nommées « cellules ». Il est possible de définir de nombreuses choses concernant la présentation de ces cellules grâce au code style="xxx".
Le tableau ci-dessous présente un bref récapitulatif des possibilités offertes par ce code. Ces possibilités sont cumulables pour la plupart d'entre elles, il suffit de les intégrer entre les guillemets en les séparant les unes des autres par un point-virgule ( ; ).
| En tapant : | J'obtiens : | Bon à savoir |
|---|---|---|
style="text-align:right" | Mon texte à droite
|
Mon texte à droite | Par défaut, le texte dans une cellule apparaît aligné à gauche. Les codes d'alignement sont left (gauche), center (centre) et right (droite).
|
style="vertical-align:middle" | Si ma cellule est large en hauteur, mon texte est aligné au centre.
|
Si ma cellule est large en hauteur, mon texte est aligné au centre. | Par défaut, le texte dans une cellule large apparaît aligné en haut. Les codes d'alignement en hauteur sont top (haut), middle (milieu) et bottom (bas).
|
style="color:blue" | Mon texte en bleu
|
Mon texte en bleu | La liste intégrale des noms de couleurs HTML se trouve ici. Vous pouvez aussi définir une couleur par son code hexadécimal. |
style="background:#7CAAC7" | Ma cellule a pour fond la couleur définie
|
Ma cellule a pour fond la couleur définie |
Exemple[modifier]
En tapant ce code :
{| class="tableaustandard"
|+ Un tableau à deux cellules
|-
| Sans "style", cette cellule garde ses valeurs par défaut.
|-
| style="text-align:center; color:white; background:#D5AA5D" | Ici, j'obtiens un texte blanc,<br>aligné au centre et sur fond orangé.
|}
On obtient ceci :
| Sans "style", cette cellule garde ses valeurs par défaut. |
| Ici, j'obtiens un texte blanc, aligné au centre et sur fond orangé. |