Gallimedia, agence web - conception, réalisation et déploiement de téléservices
(Avancée)
Recherche
Libre
Mot-clé

Mettre en forme des tableaux

Bordures, espacements, couleurs d'arrière-plan, dimensions... Passons en revue toutes les options qui vous permettront d'illustrer vos contenus avec de jolis tableaux.

Comment insérer un tableau ?

On ne peut insérer un tableau que dans les contenus de type brève ou article. Dans le corps du contenu, cliquez simplement sur l’icône "Insérer/Modifier Tableau" comme ci-contre.

La boîte de dialogue "Propriétés de Tableau" s’ouvre. Voir ci-dessous.

Les propriétés du tableau 

Voici les principales propriétés utiles d’un tableau :

  • Lignes
    Détermine le nombre de lignes de votre tableau

  • Colonnes
    Détermine le nombre  de colonnes de votre tableau

  • Bordure
    Détermine si vous souhaitez mettre une bordure au tableau et l’épaisseur qu’elle aura. Indiquez "0" pour ne pas mettre de bordure, ou "1" pour une bordure fine.
    Attention : cette propriété appliquera une bordure autour de toutes les cellules du tableau !

  • Alignement
    Détermine le positionnement du tableau dans la page. S’il est à droite ou à gauche, le texte le contournera par le côté opposé. Si votre tableau est trop large, il n’est pas nécessaire de remplir ce champ.

  • Largeur
    Détermine la largeur du tableau par rapport au contenu.
    Préférez les pourcentages qui sont plus pratiques à manier (98% pour que le tableau occupe toute la largeur, ou 50% pour la moitié, 33% pour le tiers, etc.).

  • Hauteur
    Mieux vaut ne pas remplir ce champ. Votre tableau s’adaptera en hauteur en fonction de ce qu’il y aura dedans.

  • Contour
    Cette propriété permet de placer une marge entre le bord du tableau et le texte qu’il contient.

A noter !

Une fois que toutes les propriétés sont déterminées, cliquez sur "OK" pour insérer le tableau. Les paramètres du tableau ne sont pas définitifs ! Il sera toujours possible de les modifier plus tard.

Mettre en forme le tableau

Maintenant que le tableau est créé, nous pouvons le remanier.
En faisant un clic droit sur le tableau, plusieurs options explicites s’affichent : ajouter/supprimer une ligne, ajouter/supprimer une colonne fusionner des cellules... Ces options sont bien utiles.
Tout en bas de ces options se trouvent :

  • Les propriétés de tableau, qui permettent de revenir sur les définitions du tableau. Par exemple : l’élargir s’il est trop étroit, enlever/ajouter une bordure, etc.

  • Les propriétés de cellules.

Les propriétés d’une cellule

Voici les principales propriétés utiles d’une cellule :

  • Largeur
    Détermine la largeur de la colonne dans laquelle se trouve la cellule. Comme pour les propriétés de tableau, le pourcentage est plus pratique à utiliser que les pixels. En indiquant 33%, la cellule fera un tiers de la largeur du tableau.
    Notez qu'il n'est pas nécessaire de définir la largeur de toutes les cellules. Une seule peut suffire.

  • Hauteur
    Comme pour les propriétés de tableau, cette définition n'est pas conseillée.

  • Alignement horizontal
    Pour centrer, aligner à gauche ou à droite le contenu de la cellule.

  • Alignement vertical
    Pour centrer, aligner en bas ou en haut le contenu de la cellule.

  • Fond
    Permet de définir la couleur d'arrière-plan de la cellule. Voir ci-dessous.

 

 

Exemple de tableau

 

Colonne

Ligne 1

Texte texte texte texte texte texte
Texte texte texte texte texte texte
Texte texte texte texte texte texte
Texte texte texte texte texte texte



Ligne 2

Texte texte texte texte texte texte
Texte texte texte texte texte texte
Texte texte texte texte texte texte
Texte texte texte texte texte texte

Voici les propriétés de ce tableau :

  • 2 colonnes et 3 lignes ;

  • De 45 % de  large (45 % par rapport à la page);

  • Sans bordure (bordure 0) ;

  • Avec un espacement de 0 et un contour de 5 ;

  • Le tableau est aligné à droite, ce qui permet de mettre du texte à sa gauche comme ceci ;

  • La première colonne mesure 25 % de large (25% du tableau) ;

  • La cellule "Ligne 1" a un alignement vertical en haut ;

  • La cellule "Ligne 2" a l’alignement vertical par défaut, c’est-à-dire un alignement centré ;

  • La cellule "Colonne" a une couleur d’arrière plan foncée ;

  • Pour faire ressortir le texte "Colonne", nous l’avons mis en gras et en blanc ;

  • Les textes "Ligne 1" et "Ligne 2" sont simplement en gras pour se dissocier du texte des cellules à leur droite (hiérarchisation de l’information).


 | 
 |