Aide:Les tableaux pour les experts

Un article de Wikipédia, l'encyclopédie libre.

Cette page décrit exhaustivement la syntaxe des tableaux en langage Wiki, et donne quelques conseils sur leur utilisation. Pour une explication détaillée de cette syntaxe, lire les pages Aide:Les tableaux pour les novices et Aide:Les tableaux pour les curieux.

Pour remplacer la syntaxe des tableaux en HTML, (en) Magnus Manske a créé des balises en langage Wiki. Elles remplacent les balises HTML <table>, <tr>, <td>, <th> et <caption>. Vous trouverez dans cette page, le codage HTML équivalent pour chaque exemple Wiki présenté.

Même s'il est possible d'insérer directement du code HTML pour créer des tableaux (ce code ne sera pas affiché tel quel mais retraité par MediaWiki), il est important de lui préférer la syntaxe Wiki, plus claire et plus facile à éditer.

Cet article ou cette section doit être recyclé. Une réorganisation et une clarification du contenu est nécessaire. Discutez des points à améliorer en page de discussion.

[modifier] La syntaxe des tableaux

Les tableaux et leurs éléments sont délimités principalement par la barre verticale « | » (ou tube) et les accolades « { } ». Pour utiliser ces caractères dans le texte, il faut les mettre dans la balise spéciale « nowiki » : <nowiki>| { }</nowiki>.

Les balises HTML peuvent comporter plusieurs attributs : le code Wiki permet de les insérer, certains étant prédéfinis afin d'uniformiser leur utilisation.

Un tableau s'ouvre et se ferme toujours avec les caractères suivants :

{| tableau
 |}

<table class="wikitable centre">
<tr><td>cellule</td></tr>
</table>

[modifier] Cellules

Les cellules (qui forment une ligne de tableau) peuvent être disposées verticalement, ou horizontalement dans le code Wiki :

|cellule1
|cellule2
|cellule3

À l'horizontale, il faut mettre deux barres verticales entre chaque cellule :

|cellule1||cellule2||cellule3

Chacune des cellules d'un tableau peut contenir des attributs, séparés du contenu par une autre barre verticale :

|attributs|cellule1
|attributs|cellule2
|attributs|cellule3

Ou encore, horizontalement :

|attributs|cellule1||attributs|cellule2||attributs|cellule3

<table class="wikitable centre">
<tr>
 <td>gauche</td>
 <td>droite</td>
</tr>
</table>

<table class="wikitable centre">
<tr><td>gauche </td><td> droite</td></tr>
</table>

[modifier] Lignes

Pour indiquer une nouvelle ligne, insérer :

|-

Le nombre de tirets n'a pas de limite maximale, on peut en rajouter pour rendre le code Wiki plus lisible :

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

Il est possible d'ajouter des attributs qui s'appliquent à toute la ligne :

|- attributs

<table class="wikitable centre">
<tr>
 <td>haut</td>
</tr>
<tr>
 <td>bas</td>
</tr>
</table>

[modifier] En-têtes de lignes et de colonnes

En HTML, certaines cellules d'un tableau peuvent être transformées en cellules d'en-tête indiquant le titre d'une colonne ou d'une ligne (par le changement de la balise <td> en <th>). Visuellement, ces cellules prennent une autre couleur de fond et leurs textes sont centrés et en gras.

Les en-têtes permettent aux lecteurs d'écran utilisés par les internautes malvoyants de restituer la structure logique d'un tableau : les informations données par les cellules d'en-tête pourront être rappelées par le logiciel lorsque l'utilisateur se déplace dans le reste du tableau, afin qu'il puisse comprendre la signification des différentes données. Mais pour cela, il est indispensable que leur attribut scope soit présent : seul celui-ci permet au lecteur de différencier un en-tête de ligne (scope=row) et un en-tête de colonne (scope=col).

Pour créer des en-têtes en syntaxe Wiki, on utilise le point d'exclamation à la place de la barre verticale :

! scope=col | titre1
! scope=col | titre2
! scope=col | titre3

Ou, à l'horizontale :

! scope=col | titre1 !! scope=col | titre2 !! scope=col | titre3

Avec d'autres attributs :

! scope=col attributs | titre1 !! scope=col attributs | titre2 !! scope=col attributs | titre3

Si la première ligne doit interpretée comme une ligne d'en-tête :

<table class="wikitable centre">
  <tr>
    <th scope="col">Titre colonne 1</th>
    <th scope="col">Titre colonne 2</th>
  </tr>
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
</table>

Attention, pour faire des en-tête de lignes, il n'est pas possible d'utiliser la forme horizontale du code Wiki. Sinon, le style d'en-tête se propage sur toute la ligne :

<table class="wikitable centre">
  <tr>
    <th scope="row">Titre ligne</th>
    <th>Cellule 1</th>
  </tr>
</table>

<table class="wikitable centre">
  <tr>
    <th scope="row">Titre ligne</th>
    <td>Cellule 1</td>
  </tr>
</table>

Dans le cas de tableaux complexes comportant des en-têtes qui ne s'appliquent pas à la totalité d'une ligne ou d'une colonne, l'attribut scope doit être remplacé par la combinaison des attributs id et headers. Voir à ce sujet l'atelier accessibilité.

Les utilisateurs enregistrés peuvent activer dans leurs préférences un gadget Accessibilité qui affiche notamment un outil permettant de vérifier rapidement la syntaxe des attributs scope, id et headers d'un tableau.

[modifier] Titre

Le titre du tableau, délimité par la balise HTML <caption>, est défini par le code Wiki suivant :

|+ Titre de tableau

Avec des attributs :

|+ attributs | Titre de tableau

Si plusieurs titres sont indiqués, seul el premier est pris en compte.

<table class="wikitable centre">
  <caption>Titre</caption>
  <tr>
    <th scope="col">Colonne 1</td>
    <th scope="col">Colonne 2</td>
  </tr>
</table>

[modifier] Exemple récapitulatif

{| class="wikitable centre"
|+ Titre
|
! scope=col | Titre 1
! scope=col | Titre 2
|-
! scope=row | Titre ligne
| cellule 1
| cellule 2
|}

<table class="wikitable centre">
  <caption>Titre</caption>
  <tr>
    <td></td>
    <th scope="col">Titre 1</th>
    <th scope="col">Titre 2</th>
  </tr>
  <tr>
    <th scope="row">Titre ligne</th>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
</table>

[modifier] Cellules fusionnées

Les attributs colspan et rowspan permettent de fusionner plusieurs cellules d'une ligne ou d'une colonne respectivement.

| colspan="2" | fusion de deux cellules d'une même ligne

<table class="wikitable centre">
  <tr>
    <td>Simple</td>
    <td colspan="2">Fusionnée</td>
  </tr>
  <tr>
    <td>Cellule 1</td>
    <td>Cellule 2</td>
    <td>Cellule 3</td>
  </tr>
</table>

| rowspan="3" | fusion de trois cellules d'une même colonne

<table class="wikitable centre">
  <tr>
    <td> </td>
    <td>Colonne</td>
  </tr>
  <tr>
    <td>Gauche 1</td>
    <td rowspan="3">Droite</td>
  </tr>
  <tr>
    <td>Gauche 2</td>
  </tr>
  <tr>
    <td>Gauche 3</td>
  </tr>
</table>

Le nombre de cellules fusionnées n'est pas limité. On peut mélanger ces deux attributs.

[modifier] Tableaux imbriqués

Il est possible d'imbriquer des tableaux, en remplaçant simplement le texte d'une cellule par un autre tableau. Il est cependant nécessaire de sauter une ligne entre la définition de la cellule englobante et le début du tableau imbriqué.

Les tableaux de données ne doivent en aucun cas être imbriqués : il est seulement possible mais déconseillé d'imbriquer des tableaux de mise en page, de placer un tableau de mise en page dans un tableau de données ou inversement.

{| class="wikitable centre"
| Gauche
|
 {| class="wikitable centre"
  ! scope= row | Tableau imbriqué
  |autre cellule
 |}
| Droite
|-
| Cellule 1
| Cellule 2
| Cellule 3
|}

<table class="wikitable centre">
  <tr>
    <td>Gauche</td>
    <td>
      <table class="wikitable centre">
        <tr>
          <th scope="row">Tableau imbriqué</th>
          <td>autre cellule</td>
        </tr>
      </table>
    </td>
    <td>Droite</td>
  </tr>
  <tr>
    <td>Cellule 1</td>
    <td>Cellule 2</td>
    <td>Cellule 3</td>
  </tr>
</table>

[modifier] Tableaux triables

Les tableaux peuvent être triés en utilisant la classe sortable depuis MediaWiki 1.9. Les tableaux triables s'identifient grâce aux flèches de tri des entêtes. Le code JavaScript wikibits.js qui permet le tri est copié sur les serveurs de Wikipédia. Une aide supplémentaire, en anglais, se trouve sur en:Help:Sorting.

Il est possible de créer des colonnes non triables en spécifiant le paramètre de colonne class="unsortable", et d'exclure une ligne complète du tri avec class="sortbottom".

{| class="wikitable sortable"
!Nombre!!Alphabet!!Dates!!monnaie!!class="unsortable"|Non triable
|-
|1||Z||02-02-2004||5.00||Cette
|-
|2||y||13-avr-2005||||Colonne
|-
|3||X||17.aou.2006||6.50||N'est
|-
|4||w||01.Jan.2005||4.20||Pas
|-
|5||V||05/12/2006||7.15||Triable
|- class="sortbottom"
!Total: 15!!!!!!Total: 29.55!!
|-
|}

Le tri peut être faussé par des caractères accentués, des formats de nombres ou de dates. Deux modèles permettent de donner des clés de tri aux valeurs affichées :

• le modèle {{smn}} pour les colonnes de nombres,
• le modèle {{tri}} pour les chaînes de caractères.

Les tables ayant des cellules s'étalant sur plusieurs lignes (rowspan) ou colonnes (colspan) ou ayant des cellules manquantes en fin de ligne peuvent ne pas se trier correctement.

[modifier] Les attributs de présentation

[modifier] wikitable

class="wikitable" : permet d'adapter le style "wikitable" au tableau. Plus élégant qu'un tableau classique, il impose certains attributs (comme la taille de la bordure) et définit des couleurs par défaut. class="wikitable centre" : permet d'adapter le style "wikitable" au tableau et de le centrer.

[modifier] border

border permet de spécifier la taille de la bordure du tableau. La classe "wikitable" impose sa taille de bordure et ces deux balises ne devraient pas être utilisés en même temps.

border="x"

où x est donc la taille de la bordure (la taille 0 signifie « pas de bordure »).

{| border="0"
|sans bordure 1
|sans bordure 2
|}

<table border="0">
  <tr>
    <td>sans bordure 1</td>
    <td>sans bordure 2</td>
  </tr>
</table>

{| border="1"
|bordure normale 1
|bordure normale 2
|}

<table border="1">
  <tr>
    <td>bordure normale 1</td>
    <td>bordure normale 2</td>
  </tr>
</table>

On peut également choisir le style de la bordure

style="border:Xpx Y"

X est la taille de la bordure (en pixels), et Y son style (dotted, dashed, double,...)

{|style="border:2px solid black;"
|exemple : solid
|}

<table style="border:2px solid black;">
  <tr>
    <td>exemple : solid</td>
  </tr>
</table>

{|style="border:2px dotted black;"
|exemple : dotted
|}

<table style="border:2px dotted black;">
  <tr>
    <td>exemple : dotted</td>
  </tr>
</table>

{|style="border:2px dashed black;"
|exemple : dashed
|}

<table style="border:2px dashed black;">
  <tr>
    <td>exemple : dashed</td>
  </tr>
</table>

{|style="border:5px double black;"
|exemple : double
|}

<table style="border:5px double black;">
  <tr>
    <td>exemple : double</td>
  </tr>
</table>

[modifier] align et valign

align et valign positionnent le tableau et le contenu des cellules. Un tableau est aligné selon l'axe horizontal : à gauche, à droite ou au milieu. Pour le contenu d'une cellule, on peut le positionner en haut, en bas ou au milieu de la cellule.

Pour l'alignement horizontal, c'est align, alors que pour l'alignement vertical, c'est valign :

align="left"
align="center"
align="right"

valign="top"
valign="middle"
valign="bottom"

Un exemple de positionnement d'un tableau :

{| align="left" class="wikitable"
|à gauche
|}

<table align="left" class="wikitable">
  <tr>
    <td>à gauche</td>
  </tr>
</table>

{| align="center" class="wikitable"
|au centre
|}

<table align="center" class="wikitable">
  <tr>
    <td>au centre</td>
  </tr>
</table>

{| align="right" class="wikitable"
|à droite
|}

<table align="right" class="wikitable">
  <tr>
    <td>à droite</td>
  </tr>
</table>

Les trois positions sont à gauche, au milieu et à droite :

{| class="wikitable center"
| Positionnement
|-
| align="left" | g
|-
| align="center" | c
|-
| align="right" | d
|}

<table class="wikitable centre">
  <tr>
    <td>Positionnement</td>
  </tr>
  <tr>
    <td align="left">g</td>
  </tr>
  <tr>
    <td align="center">c</td>
  </tr>
  <tr>
    <td align="right">r</td>
  </tr>
</table>

Pour chacune des cellules, il est également possible de positionner le contenu verticalement. Dans l'exemple qui suit, il y a une cellule (celle de gauche) avec une taille de 150 pixels.

{| class="wikitable centre"
| height="150" | Position
| valign="top" | haut
| valign="middle" | milieu
| valign="bottom" | bas
|}

<table class="wikitable centre">
  <tr>
    <td height="150">Position</td>
    <td valign="top">haut</td>
    <td valign="middle">milieu</td>
    <td valign="bottom">bas</td>
  </tr>
</table>

[modifier] cellspacing, cellpadding et margin

cellspacing et cellpadding modifient l'espacement entre les cellules (cellspacing) et l'espacement entre le bord d'une cellule et son contenu (cellpadding). Il existe également margin (style="margin:") qui modifie l'espacement entre le bord d'une cellule et le contenu extérieur:

cellspacing="x"

cellpadding="x"

style="margin:x px;"

Avec l'attribut cellspacing :

{| border="1" cellspacing="5"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" cellspacing="5">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

{| border="1" cellspacing="20"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" cellspacing="20">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

Avec l'attribut cellpadding :

{| border="1" cellpadding="5"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" cellpadding="5">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

{| border="1" cellpadding="20"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" cellpadding="20">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

Avec l'attribut margin (seulement utilisable avec style=, voir quelques sections plus bas) :

{| border="1" align="left" style="margin:0px;"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" align="left" style="margin:0px;">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

{| border="1" align="left" style="margin-right:20px;"
|cellule 1
|cellule 2
|-
|cellule 3
|cellule 4
|}

<table border="1" align="left" style="margin-right:20px;">
  <tr>
    <td>cellule 1</td>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
    <td>cellule 4</td>
  </tr>
</table>

[modifier] width et height

width et height spécifient la largeur et la hauteur, aussi bien du tableau que des cellules. La taille peut se préciser en pixels ou en pourcentage. Dans les deux cas, cela représente une taille minimale.

Le premier exemple montre l'utilisation d'une taille fixe. Le premier cas utilise une largeur de 10 pixels, cependant la largeur du contenu du tableau étant plus grande, il s'adapte donc à cette taille. Le second cas utilise une taille de 100 pixels ; 100 pixels est plus grand que la largeur occupée par le contenu du tableau, celui-ci a donc bien une largeur de 100 pixels. Le troisième exemple utilise une largeur de 200 pixels.

{| class="wikitable" width="10"
|cellule
|}

<table border="1" width="10">
  <tr>
    <td>cellule</td>
  </tr>
</table>

{| class="wikitable" width="100"
|cellule
|}

<table class="wikitable" width="100">
  <tr>
    <td>cellule</td>
  </tr>
</table>

{| class="wikitable" width="200"
|cellule
|}

<table class="wikitable" width="200">
  <tr>
    <td>cellule</td>
  </tr>
</table>

Voyons ce qu'il en est de l'utilisation d'une taille proportionnelle. Dans le premier cas, le tableau doit occuper un maximum de 33% de la largeur disponible. Dans le deuxième et le troisième cas, le tableau doit respectivement occuper un maximum de 50% et de 100%, de l'espace disponible.

{| class="wikitable centre" width="33%"
|cellule
|}

<table class="wikitable centre" width="33%">
  <tr>
    <td>cellule</td>
  </tr>
</table>

{| class="wikitable centre" width="50%"
|cellule
|}

<table class="wikitable centre" width="50%">
  <tr>
    <td>cellule</td>
  </tr>
</table>

{| class="wikitable centre" width="100%"
|cellule
|}

<table class="wikitable centre" width="100%">
  <tr>
    <td>cellule</td>
  </tr>
</table>

Pour l'attribut height, l'utilisation est la même que pour width, mais cette fois-ci la hauteur du tableau change. Ces deux attributs peuvent également être utilisés pour chacune des cellules :

{| class="wikitable centre" width="100%"
| colspan="3" | Tableau 1
|-
| width="33%" | 1/3 cellule 1
| width="33%" | 1/3 cellule 2
| width="33%" | 1/3 cellule 3
|}

<table class="wikitable centre" width="100%">
  <tr>
    <td colspan="3">Tableau 1</td>
  </tr>
  <tr>
    <td width="33%">1/3 cellule 1</td>
    <td width="33%">1/3 cellule 2</td>
    <td width="33%">1/3 cellule 3</td>
  </tr>
</table>

{| class="wikitable centre" width="100%"
| colspan="3" | Tableau 2
|-
| width="50%" | 1/2
| width="25%" | 1/4
| width="25%" | 1/4
|}

<table class="wikitable centre" width="100%">
  <tr>
    <td colspan="3">Tableau 2</td>
  </tr>
  <tr>
    <td width="50%">1/2</td>
    <td width="25%">1/4</td>
    <td width="25%">1/4</td>
  </tr>
</table>

[modifier] bgcolor et ligne grise

bgcolor permet de changer la couleur de fond d'une cellule :

bgcolor="#hex"

Pour spécifier une couleur, insérer le caractère # suivi du code couleur en hexadécimal.

{| class="wikitable centre"
| bgcolor="#FF0000" | rouge
| bgcolor="#00FF00" | vert
| bgcolor="#0000FF" | bleu
|}

<table class="wikitable centre">
  <tr>
    <td bgcolor="#FF0000">rouge</td>
    <td bgcolor="#00FF00">vert</td>
    <td bgcolor="#0000FF">bleu</td>
  </tr>
</table>

Le modèle {{ligne grise}} permet d'alterner les couleurs de ligne pour faciliter leur lecture :

|- {{ligne grise}}

<table class="wikitable centre">
  <tr>
    <td>Ligne 1</td>
    <td>fond blanc</td>
  </tr>
  <tr bgcolor="#f5f5f5">
    <td>Ligne 2</td>
    <td>fond gris</td>
  </tr>
  <tr>
    <td>Ligne 3</td>
    <td>fond blanc</td>
  </tr>
  <tr bgcolor="#f5f5f5">
    <td>Ligne 4</td>
    <td>fond gris</td>
  </tr>
</table>

[modifier] style

Le style permet de changer tout l'aspect graphique, tant dans le tableau que pour une cellule. Changeons la couleur de fond du tableau :

{| class="wikitable centre" style="background-color:#CCFFCC"
| cellule 1
|-
| cellule 2
|-
| cellule 3
|}

<table class="wikitable centre" style="background-color:#CCFFCC">
  <tr>
    <td>cellule 1</td>
  </tr>
  <tr>
    <td>cellule 2</td>
  </tr>
  <tr>
    <td>cellule 3</td>
  </tr>
</table>

L'attribut style permet de spécifier la mise en forme comme la couleur, la police de caractère, la couleur de fond pour une cellule, etc. Reportez-vous à un tutorial sur le CSS.

[modifier] Utilisation des tableaux

[modifier] Quand les tableaux sont-ils appropriés ?

Les tableaux sont parfaits pour organiser toute information qui sera plus clairement présentée dans un format lignes/colonnes :

• tableaux mathématiques
  • tables de multiplication
  • tables de division
  • tableaux de recherche
• listes d'informations
  • mots équivalents dans deux ou plusieurs langues
  • personnalités, date de naissance, fonction
  • artiste, disque, année et maison d'édition

Certains articles comportent des listes excessivement longues très difficiles à éditer si elles se retrouvent sous forme de tableaux. Avant de transformer une liste en tableau, essayez d'imaginer l'aspect sous forme de tableau afin d'être sûr de son utilité.

[modifier] Quand les tableaux sont-ils inappropriés ?

Les tableaux ne doivent pas être utilisés uniquement pour la présentation. Si l'information que vous éditez n'est pas de nature tabulaire, elle ne devra alors pas être mise en tableau. Évitez d'utiliser les tableaux pour mettre une légende sous une illustration, ordonner un groupe de liens ou autres cas strictement visuels. Cela rend l'article trop difficile à éditer pour d'autres wikipédiens.

[modifier] Liste très longues ou listes très courtes

Si une liste est très longue ou au contraire très simple, préférez les listes standards de Wikipédia. Les listes longues seront difficiles à maintenir si elles se retrouvent à l'intérieur de tableaux et les listes courtes sont souvent trop simples pour nécessiter un formatage en tableau.

Voici un petit exemple à ne pas suivre :

1980	Vague de pluie
1988	Nom d'un chat !
1994	La vie, la pomme
1994	Le ciel est vert

Choisissez plutôt une liste :

• 1980 : Vague de pluie
• 1988 : Nom d'un chat !
• 1994 : La vie, la pomme
• 1994 : Le ciel est vert

[modifier] Légende d'illustration

Souvent, les illustrations d'un article sont placées dans un semblant de tableau. Du fait que le tableau peut être flottant et placé à gauche ou à droite de l'écran, il parait facile et pratique d'utiliser un tableau unicellulaire pour placer l'image à un endroit précis de l'écran. Cette solution était nécessaire pour les anciens navigateurs, particulièrement ceux qui ne reconnaissaient pas les feuilles de style en cascade pour l'affichage de telles images. En 2007, la plupart des navigateurs fonctionnent très bien avec les feuilles de style. Aussi, la façon recommandée d'afficher les images est d'utiliser les balises nommées div.

Voici un exemple à ne pas faire :

{| align="right" border="0" cellpadding="0" | [[Image:Myrtille-small.jpg|photo de myrtille]] |}

Procédez de la façon suivante :

[[Image:Myrtille-small.jpg|right|photo de myrtille]]

Dans ces deux cas, le résultat sera le même. L'illustration sera flottante à droite de l'écran et de texte environnant habillera l'illustration. Voici ce que cela donne dans votre navigateur (avec du texte ajouté) :

La myrtille (du latin myrtus, du grec murtos : myrte, symbole de l'amour ou de la gloire) est l'espèce Vaccinium myrtillus, airelle également connue sous les dénominations de airelle myrtille, arbrêtier, gueule noire, mauret, brimbelle ou raisin des bois. Au Canada, on l'appelle bleuet et sa culture est très importante, notamment celle des fruits sauvages. Le nom myrtille désigne aussi bien le végétal que son fruit, mais le terme de myrtillier est cependant usité.

La myrtille est un vigoureux sous-arbrisseau vivace et rampant, de 20 à 60 cm, que l'on trouve en Eurasie et en Amérique du Nord et qui forme des fourrés nains en dressant des rameaux serrés aux tiges vertes à section triangulaire. En France, elle est commune en montagne, surtout dans la moitié Nord de la France. Elle croît entre 400 à 2500 m d'altitude dans les forêts de conifères, les bois clairs, les landes et les tourbières, associée aux plantes acidophiles.

Dans le langage des fleurs, la myrtille signifie que l'on recherche la solitude.

[modifier] Problèmes éventuels

Les tableaux peuvent provoquer des difficultés, surtout lorsqu'ils ne sont pas correctement utilisés. Voici quelques cas que vous pourriez rencontrer lors de l'usage de tableaux dans vos articles :

• Les tableaux peuvent être une difficulté pour certains éditeurs, spécialement pour les nouveaux wikipédiens. Les nouveaux éditeurs peuvent être effrayés lorsqu'ils cliquent sur « Modifier cette page » et qu'ils découvrent un gros pavé inintelligible (pour eux) de code HTML. Essayez de conserver des tableaux simples et respectant la codification. Vous pouvez également ajouter des commentaires (qui n'apparaîtront pas dans la page normale) du genre « <!-- Pour éditer le texte de cet article, dépassez le tableau. --> » afin de rassurer les éditeurs.
• Il est souvent difficile, même pour des auteurs expérimentés en HTML, d'être sûr de l'aspect qu'aura le tableau dans tous (ou beaucoup) de navigateurs. Même la plus petite erreur typographique peut avoir des conséquences catastrophiques sur l'affichage du tableau. Même si vous êtes confiant dans votre aptitude à éviter ce genre de problème, il se peut que ce ne soit pas le cas de futurs éditeurs. Encore une fois, essayez d'élaborer des tableaux simples et bien écrit afin de minimiser les risques.
• Les gros tableaux contenant beaucoup d'informations peuvent dépasser le bord droit de l'écran à de basses résolutions d'affichage. Cela peut parfois être acceptable, spécialement si le lecteur y a été préparé (notamment lorsque l'on sait par avance qu'un tableau comme la Table des isotopes est volontairement très grande). Si vous devez, pour votre article, créer un tableau vraiment très grand, considérez alors qu'il y aura lieu d'en créer un autre plus simple, plus petit, pour les utilisateurs qui ne pourront pas visualiser la version longue.
• Si vous insérez du texte à chasse fixe dans un tableau (en utilisant les balises HTML code, pre ou tt, par exemple), cela forcera la page à être plus large que nécessaire. Tant que cela est possible, évitez l'utilisation de tels textes dans vos tableaux, ainsi le texte sera adapté naturellement. Un problème identique survient lors de l'insertion d'images dans un tableau (car les images sont généralement contraintes à une taille fixe).

[modifier] Voir aussi

• Aide:Les tableaux pour les nuls
• Aide:Réaliser un tableau en code wiki
• Charte graphique : Apparence des tableaux
• Wikipédia:Modèles/Tableaux : modèles pour faciliter la création de tableaux