mis à jour le 01.11.2003

remarques, réflexions : Christian Oïhénart

Les tableaux

Les tableaux permettent de mettre en forme de l'information, texte ou images, sur vos pages Web ; ils sont donc un puissant outil de mise en page, par exemple pour réaliser une page sur deux colonnes ou encadrer des blocs de texte.

Deux possibilités existent pour créer un tableau

  • soit en importer un depuis un tableur (par copier-coller sur une zone vierge de la page) ou depuis une base de données, un traitement de texte (par copier-coller d'un texte tabulé sur un tableau vierge dans Home Page).
  • soit en créer un vide par le bouton ou par Tableau dans le menu Insertion ou en faisant glisser le bouton sur le document

Par défaut, le tableau inséré comprend 2 lignes et 2 colonnes. En double-cliquant sur le tableau, vous pouvez modifier ses caractéristiques tant au niveau des cellules que du tableau dans son ensemble (si vous souhaitez agir uniquement au niveau du tableau, il faut double-cliquer sur le bord de celui-ci).

 

Les différents paramètres importants :

  • Lignes : se modifient directement en entrant le nombre ou en faisant Ajouter ou Supprimer
  • Colonnes : se modifient directement en entrant le nombre ou en faisant Ajouter ou Supprimer
    (les lignes et les colonnes s'insèrent après la ligne ou la colonne où se trouve le curseur)
  • Largeur : la valeur peut être absolue (en pixels), relative (pourcentage de la fenêtre du navigateur) ou Auto
  • Hauteur : la valeur peut être absolue (en pixels), relative (pourcentage de la fenêtre du navigateur) ou Auto
  • Espacement contrôle la largeur de la bordure des cellules (gère l'espacement entre les différentes cellules)
  • Remplissage contrôle l'espace entre le contenu des cellules et la bordure
  • Bordure gère l'épaisseur de la bordure (à mettre à 0 si on veut que le tableau soit invisible)
  • Couleur de tableau : spécifie la couleur d'arrière-plan du tableau
  • Image de tableau : spécifie l'image d'arrière-plan du tableau (papier peint)

Les dimensions d'un tableau peuvent aussi être gérées à la souris, en cliquant sur le bord extérieur ou entre deux lignes ou deux colonnes.

Par défaut, la largeur du tableau est automatique, la largeur de la page étant divisée par le nombre de colonnes, en fonction de la taille de la fenêtre du navigateur.
Le réglage de la taille des colonnes et de celle du tableau peut se faire en combinant l'utilisation de la souris et l'entrée des dimensions au clavier. Par exemple, pour un tableau de trois colonnes, on peut vouloir avoir les deux premières colonnes fixes, ainsi que celle du tableau. A ce moment, on réglera la taille des colonnes A et B en nombres de pixels, ainsi que celle du tableau, et on laissera la taille de la troisième colonne en automatique. Avec un peu d'entraînement, les tableaux deviennent un formidable outil de mise en page.

Pour saisir du texte dans une cellule, il suffit de cliquer à l'intérieur pour la sélectionner ou de coller directement le texte dans la cellule.

Pour insérer une image dans une cellule, il suffit de la sélectionner et de cliquer sur le bouton d'Insertion d'image. Attention, la taille de la cellule s'adapte en hauteur à la taille de l'image si celle-ci est supérieure, mais la largeur devra être éventuellement adaptée manuellement.

Les cellules ont aussi leurs propres caractéristiques, contrôlées par un onglet

Quelques paramètres importants :

  • Étendue : cela permet de modifier la hauteur ou la largeur d'une cellule de sorte qu'elle englobe plusieurs cellules d'une ligne ou d'une colonne. On peut ainsi obtenir des tableaux complexes, comme ci-dessous
    

  
  
  
   
  
   
   

   

 

  • Alignement horizontal : cela ne paraît pas fonctionner, il faut donc gérer l'alignement avec les boutons de la barre d'outils
  • Alignement vertical : cela aligne bien le contenu de la cellule verticalement
  • Retour à la ligne : permet à la cellule de contenir plusieurs lignes de texte
  • Cellule de titre : transforme la cellule en cellule de titre (texte en gras)
  • Image de la cellule : spécifie l'image d'arrière-plan de la cellule (papier peint)
 
Attention, une colonne ou une ligne qui ne contient rien ou dont les dimensions ont été fixées sur Auto n'est pas correctement affichée suivant les navigateurs. La parade consiste à :

1 fixer des tailles de cellules en pixels,
2 insérer une image blanche
3 entrer des espaces en mode Préformaté
4 entrer des espaces insécables (option-espace sur Mac / majuscule-espace sur PC)

Lorsque l'on utilise des tableaux pour faire une mise en page, il vaut mieux créer plusieurs tableaux contenant peu de lignes plutôt qu'un seul. Cela permet un affichage plus rapide.

Page précédente Page suivante