Placez le point d'insertion à l'endroit où vous souhaitez que le tableau apparaisse.
Dernière mise à jour le
27 avr. 2021
Découvrez comment utiliser des tableaux pour présenter du contenu sur votre site web. Vous apprendrez également à fractionner et fusionner des cellules, ainsi qu’à importer et exporter des données tabulaires.
Les tableaux constituent un outil puissant pour présenter des données tabulaires sur une page HTML. Un tableau comprend au moins une ligne ; chaque ligne comporte au moins une cellule. Bien que les colonnes ne soient généralement pas spécifiées explicitement dans le code HTML, Dreamweaver vous permet de manipuler les colonnes ainsi que les lignes et les cellules.
Annotation
Il est recommandé de ne pas utiliser de tableaux pour la mise en page de votre page web.Essayez les modèles de base (Fichier > Nouveau > Modèles de base) pour commencer avec des mises en page prédéfinies. Vous pouvez insérer votre propre texte et vos images dans ces mises en page, et les mettre en forme à l'aide de CSS.
Ordre de priorité de la mise en forme des tableaux en HTML
Lorsque vous formatez des tableaux en mode Création, vous pouvez définir des propriétés s’appliquant au tableau tout entier ou à une série de lignes, de colonnes ou de cellules sélectionnées dans le tableau. Lorsqu'une propriété (une couleur d'arrière-plan ou un alignement, par exemple) est définie par une valeur pour tout le tableau et par une autre valeur pour chaque cellule, les propriétés de formatage des cellules prévalent sur les propriétés de formatage de lignes, qui à leur tour prévalent sur celles du tableau.
L'ordre de priorité pour le formatage de tableau est le suivant :
- Cellules
- Lignes
- Tableau
Par exemple, si vous définissez la couleur d'arrière-plan d'une cellule unique sur bleu, puis définissez la couleur d'arrière-plan de l'ensemble du tableau sur jaune, la cellule bleue ne devient pas jaune, car la mise en forme des cellules prime sur la mise en forme du tableau.
Annotation
Lorsque vous définissez des propriétés sur une colonne, Dreamweaver modifie les attributs de la balise td correspondant à chaque cellule de la colonne.
Division et fusion de cellules de tableau
Vous pouvez fusionner n'importe quel nombre de cellules adjacentes — tant que l'ensemble de la sélection est une ligne ou un rectangle de cellules — pour produire une cellule unique qui s'étend sur plusieurs colonnes ou lignes.Vous pouvez diviser une cellule en n'importe quel nombre de lignes ou de colonnes, qu'elle ait été préalablement fusionnée ou non. Dreamweaver restructure automatiquement le tableau (en ajoutant tous les attributs colspan ou rowspan nécessaires) pour créer la disposition spécifiée.
Dans l'exemple suivant, les cellules situées au centre des deux premières lignes ont été fusionnées en une seule cellule qui s'étend sur deux lignes.
Insertion d’un tableau et ajout de contenu
Utilisez le panneau Insertion ou le menu Insertion pour créer un nouveau tableau. Ensuite, ajoutez du texte et des images aux cellules du tableau de la même manière que vous ajoutez du texte et des images en dehors d'un tableau.
Annotation
Si votre document est vierge, vous ne pouvez placer le point d'insertion qu'au début du document.
Choisissez Insertion > Tableau.
Dans la catégorie HTML du panneau Insertion, cliquez sur Tableau.
Définissez les attributs de la boîte de dialogue Tableau et cliquez sur
OK pour créer le tableau.
Lignes
Détermine le nombre de lignes du tableau.
Colonnes
Détermine le nombre de colonnes du tableau.
Largeur du tableau
Spécifie la largeur du tableau en pixels, ou en pourcentage de la largeur de la fenêtre du navigateur.
Largeur de la bordure
Indique la largeur, en pixels, des bordures du tableau.
Espacement des cellules
Détermine le nombre de pixels séparant les cellules contiguës d’un tableau.
Annotation
Lorsque vous n’affectez pas explicitement de valeur pour la largeur de la bordure, l’espacement entre les cellules et la marge intérieure des cellules, la plupart des navigateurs affichent une largeur de bordure et une marge intérieure des cellules définies sur 1, ainsi qu’un espacement entre les cellules défini sur 2. Pour être sûr que les navigateurs afficheront le tableau sans bordure, marge intérieure ni espacement, définissez Marge intérieure des cellules et Espacement entre les cellules sur 0.
Marge intérieure des cellules
Détermine le nombre de pixels entre la bordure d'une cellule et son contenu.
Aucun
N'autorise pas les en-têtes de colonne ou de ligne pour le tableau.
Gauche
Transforme la première colonne du tableau en colonne d'en-têtes, de sorte que vous puissiez saisir un en-tête pour chaque ligne du tableau.
Haut
Fait de la première ligne du tableau une ligne pour les en-têtes, de sorte que vous puissiez saisir un en-tête pour chaque colonne du tableau.
Les deux
Vous permet d'entrer des en-têtes de colonne et de ligne dans le tableau.
Annotation
Il est judicieux d’employer des en-têtes au cas où l’un des visiteurs de votre site web utiliserait un lecteur d’écran. Les lecteurs d’écran lisent les en-têtes de tableau et aident les utilisateurs à garder une trace des informations de tableau.
Légende
Fournit un titre de tableau qui s'affiche en dehors du tableau.
Récapitulatif
Fournit une description du tableau. Les lecteurs d'écran lisent le texte de résumé, mais le texte n'apparaît pas dans le navigateur de l'utilisateur.
Importation et exportation de tableaux
Vous pouvez importer des données tabulaires créées dans une autre application (comme Microsoft Excel) et enregistrées dans un format de texte délimité (avec des éléments séparés par des tabulations, des virgules, des deux-points ou des points-virgules) dans Dreamweaver et les formater sous forme de tableau.
Vous pouvez également exporter des données de tableau depuis Dreamweaver vers un fichier texte, avec le contenu des cellules adjacentes séparé par un séparateur.Vous pouvez utiliser des virgules, des deux-points, des points-virgules ou des espaces comme séparateurs.Lorsque vous exportez un tableau, l'ensemble du tableau est exporté ; vous ne pouvez pas sélectionner des portions d'un tableau à exporter.
Annotation
Si vous ne voulez que certaines données d'un tableau (par exemple, les six premières lignes ou les six premières colonnes), alors copiez les cellules contenant ces données, collez ces cellules à l'extérieur du tableau (pour créer un nouveau tableau), et exportez le nouveau tableau.
Importation de données tabulaires
Sélectionnez Fichier > Importation > Importer des données tabulaires.
Définissez les options relatives aux données tabulaires, puis cliquez sur OK.
Fichier de données
Correspond au nom du fichier à importer. Cliquez sur le bouton Parcourir pour sélectionner un fichier.
Délimiteur
Correspond au délimiteur utilisé dans le fichier que vous importez.
Si vous choisissez Autre, une zone de texte apparaît à droite du menu contextuel. Entrez le délimiteur utilisé dans votre fichier.
Annotation
spécifiez le délimiteur utilisé lors de l’enregistrement du fichier de données. Dans le cas contraire, le fichier ne pourra pas être importé correctement et vos données ne seront pas formatées convenablement dans un tableau.
Largeur du tableau
Correspond à la largeur du tableau.
Sélectionnez Adapter au contenu pour adapter la largeur de chaque colonne à la plus longue chaîne de texte qu'elle contient.
Sélectionnez Fixe pour spécifier une largeur de tableau fixe, en pixels ou en pourcentage de la largeur de fenêtre du navigateur.
Bordure
Indique la largeur, en pixels, des bordures du tableau.
Marge intérieure des cellules
Le nombre de pixels entre le contenu d'une cellule et les bordures de la cellule.
Espacement des cellules
Détermine le nombre de pixels séparant les cellules contiguës d'un tableau.
Annotation
Lorsque vous n’affectez pas explicitement de valeur pour les bordures, l’espacement entre les cellules et la marge intérieure des cellules, la plupart des navigateurs affichent des bordures et une marge intérieure des cellules définies sur 1, ainsi qu’un espacement entre les cellules défini sur 2. Pour être sûr que les navigateurs afficheront le tableau sans marge intérieure ni espacement, définissez Marge intérieure des cellules et Espacement entre les cellules sur 0. Pour visualiser les contours des cellules et du tableau lorsque la bordure est définie sur 0, sélectionnez Affichage > Assistances visuelles > Bordures de tableau.
Formatage ligne supérieure
Détermine quel formatage, le cas échéant, est appliqué à la ligne supérieure du tableau.Sélectionnez parmi quatre options de formatage : aucun formatage, gras, italique ou gras italique.
Exportation d’un tableau
Placez le point d'insertion dans n'importe quelle cellule du tableau.
Sélectionnez Fichier > Exporter > Table.
Définissez les options suivantes :
Délimiteur
Spécifie quel caractère séparateur doit être utilisé pour séparer les éléments dans le fichier exporté.
Sauts de ligne
Spécifie dans quel système d'exploitation vous ouvrirez le fichier exporté : Windows, Macintosh ou UNIX.(Les différents systèmes d'exploitation ont différentes façons d'indiquer la fin d'une ligne de texte.)
Cliquez sur Exporter.
Saisissez un nom pour le fichier, puis cliquez sur Enregistrer.
Sélection d’éléments de tableau
Vous pouvez sélectionner un tableau, une ligne ou une colonne entière d'un coup.Vous pouvez également sélectionner une ou plusieurs cellules individuelles.
Lorsque vous déplacez votre pointeur sur un tableau, une ligne, une colonne ou une cellule, Dreamweaver met en surbrillance toutes les cellules de cette sélection afin que vous sachiez quelles cellules seront sélectionnées.Ceci est utile lorsque vous avez des tableaux sans bordures, des cellules qui s'étendent sur plusieurs colonnes ou lignes, ou des tableaux imbriqués.Vous pouvez modifier la couleur de surbrillance dans les préférences.
Annotation
Si vous placez le pointeur sur la bordure d'un tableau, puis maintenez la touche Contrôle (Windows) ou Commande (Macintosh), toute la structure du tableau (c'est-à-dire toutes les cellules du tableau) est mise en surbrillance.Ceci est utile lorsque vous avez des tableaux imbriqués et que vous voulez voir la structure de l'un des tableaux.
Sélection d’un tableau entier
Effectuez l'une des actions suivantes pour sélectionner un tableau :
- Cliquez sur le coin supérieur gauche du tableau pour sélectionner le tableau.
- Cliquez dans une cellule du tableau, puis sélectionnez la balise dans le sélecteur de balises situé dans le coin inférieur gauche de la fenêtre Document.
- Cliquez dans une cellule du tableau, puis sur le menu d’en-tête du tableau et choisissez Sélectionner le tableau. Des poignées de sélection apparaissent sur les bords inférieurs et droits du tableau sélectionné.
- Cliquez dans une cellule de tableau et sélectionnez Édition > Tableau > Sélectionner le tableau.
Sélectionnez des lignes ou des colonnes individuelles ou multiples
Positionnez le pointeur vers le
bord gauche d'une ligne ou le bord supérieur d'une colonne.
Lorsque le pointeur se transforme en flèche de sélection, cliquez
pour sélectionner une ligne ou une colonne, ou faites glisser pour sélectionner plusieurs lignes ou colonnes.
Sélection d’une seule colonne
Cliquez dans la colonne.
Cliquez
sur le menu d'en-tête de colonne et choisissez Sélectionner la colonne.
Sélection d’une seule cellule
Effectuez l’une des opérations suivantes :
- Cliquez dans la cellule, puis sélectionnez la balise <td> dans le sélecteur de balises dans le coin inférieur gauche de la fenêtre de document.
- Cliquez dans la cellule en maintenant la touche Ctrl (Windows) ou Commande (Macintosh) enfoncée.
Sélectionnez une ligne ou un bloc rectangulaire de cellules
Effectuez l’une des tâches suivantes :
Faites glisser la souris d'une cellule vers une autre.
Cliquez sur une cellule. Tout en appuyant sur la touche Ctrl (Windows) ou Commande (Macintosh), cliquez sur la même cellule, puis cliquez dans une autre cellule en maintenant la touche Maj enfoncée.
Sélection de cellules non adjacentes
Cliquez en maintenant la touche Ctrl enfoncée (Windows) ou Commande enfoncée
(Macintosh) sur les cellules, lignes ou colonnes que vous voulez sélectionner.
Si chaque cellule, ligne ou colonne sur laquelle vous cliquez en maintenant Ctrl ou Commande enfoncée n'est pas déjà sélectionnée, elle est ajoutée à la sélection. Si elle est déjà sélectionnée, elle est supprimée de la sélection.
Modifier la couleur de surbrillance des éléments de tableau
Sélectionnez
Édition > Préférences (Windows) ou Dreamweaver >
Préférences (Macintosh).
Sélectionnez Surbrillance dans la liste des catégories à gauche,
apportez l'une des modifications suivantes, puis cliquez sur OK.
Pour modifier la couleur de surbrillance des éléments du tableau, cliquez dans la case de couleur Survol et sélectionnez une couleur de surbrillance à l'aide du sélecteur de couleur (ou tapez la valeur hexadécimale correspondant à la couleur de surbrillance dans la zone de texte).
Pour activer ou désactiver la sélection d'éléments du tableau, activez ou désactivez l'option Afficher de l'option Survol.
Annotation
Ces options affectent tous les objets que Dreamweaver met en surbrillance lorsque vous déplacez le pointeur dessus.
Définition des propriétés d’un tableau
Vous pouvez utiliser l'inspecteur des propriétés pour modifier les tableaux.
Sélectionnez un tableau.
Dans l'inspecteur des propriétés (Fenêtre > Propriétés), modifiez les propriétés si nécessaire.
ID de tableau
Un identificateur du tableau.
Lignes et colonnes
Le nombre de lignes et de colonnes dans le tableau.
L
La largeur du tableau, en pixels ou en pourcentage de la largeur de fenêtre du navigateur.
Annotation
Il est rarement utile de définir la hauteur d'un tableau.
Remplissage
Le nombre de pixels entre le contenu d'une cellule et les bordures de la cellule.
Espacement cellules
Détermine le nombre de pixels séparant les cellules contiguës d'un tableau.
Alignement
Détermine la position du tableau par rapport aux autres éléments du même paragraphe (texte ou images).
Gauche aligne le tableau sur la gauche des autres éléments (pour que le texte situé dans le même paragraphe apparaisse à droite du tableau) ; Droite aligne le tableau sur la droite des autres éléments (le texte apparaissant à gauche du tableau) ; et Centrer centre le tableau (le texte apparaissant au-dessus et/ou en dessous du tableau). Par défaut indique que le navigateur doit utiliser son alignement par défaut.
Annotation
Lorsque l’alignement est défini sur Par défaut, le reste du contenu n’est pas affiché à côté du tableau. Pour afficher un tableau à côté du contenu, utilisez l’alignement à droite ou à gauche.
Bordure
Indique la largeur, en pixels, des bordures du tableau.
Annotation
Lorsque vous n’affectez pas explicitement de valeur pour la bordure, l’espacement entre les cellules et la marge intérieure des cellules, la plupart des navigateurs affichent la bordure et une marge intérieure des cellules définies sur 1, ainsi qu’un espacement entre les cellules défini sur 2. Pour être sûr que les navigateurs afficheront le tableau sans marge intérieure ni espacement, définissez Bordure sur 0, Marge intérieure des cellules et Espacement entre les cellules sur 0. Pour visualiser les contours des cellules et du tableau lorsque la bordure est définie sur 0, sélectionnez Affichage > Assistances visuelles > Bordures de tableau.
Classe
Applique une classe CSS au tableau.
Annotation
il peut être nécessaire de développer l’inspecteur Propriétés du tableau pour afficher les options suivantes. Pour cela, cliquez sur la flèche de développement dans le coin inférieur droit de l’inspecteur.
Effacer les largeurs de colonnes et Effacer les hauteurs de lignes
et Effacer hauteurs de ligne suppriment toutes les valeurs de hauteur de ligne ou de largeur de colonne du tableau explicitement spécifiées.
Convertir les largeurs de tableau en pixels/Convertir les hauteurs de tableau en pixels
et Convertir les hauteurs de tableau en pixels définissent la largeur ou la hauteur de chaque colonne du tableau à sa largeur actuelle en pixels (définissent également la largeur de l'ensemble du tableau à sa largeur actuelle en pixels).
Convertir les largeurs de tableau en pourcentage/Convertir les hauteurs de tableau en pourcentages
et Convertir les hauteurs de tableau en pourcentage définissent la largeur ou la hauteur de chaque colonne du tableau à sa largeur actuelle exprimée en pourcentage de la largeur de la fenêtre document (définissent également la largeur de l'ensemble du tableau à sa largeur actuelle en pourcentage de la largeur de la fenêtre document).
Si vous avez saisi une valeur dans une zone de texte, appuyez sur Tab ou Entrée (Windows) ou Retour (Macintosh) pour appliquer la valeur.
Définition des propriétés de cellule, de ligne ou de colonne
Vous pouvez utiliser l'inspecteur des propriétés pour modifier les cellules et les lignes d'un tableau.
Sélectionnez une ligne ou une colonne.
Dans l’inspecteur des propriétés (Fenêtre > Propriétés), définissez les options suivantes :
Horiz
Spécifie l'alignement horizontal du contenu d'une cellule, ligne ou colonne. Vous pouvez aligner le contenu à gauche, à droite ou au centre des cellules, ou indiquer que le navigateur doit utiliser son alignement par défaut (généralement à gauche pour les cellules normales et au centre pour les cellules d'en-tête).
Vertic
Spécifie l'alignement vertical du contenu d'une cellule, ligne ou colonne. Vous pouvez aligner le contenu en haut, au milieu, en bas ou à la ligne de base des cellules, ou indiquer que le navigateur doit utiliser son alignement par défaut (généralement au milieu).
L et H
La largeur et la hauteur des cellules sélectionnées en pixels ou en pourcentage de la largeur ou de la hauteur de tout le tableau. Pour spécifier un pourcentage, faites suivre la valeur du signe de pourcentage (%). Pour laisser au navigateur le soin de déterminer la largeur et la hauteur appropriées, en fonction du contenu de la cellule et des largeurs et hauteurs des autres colonnes et lignes, laissez le champ vide (paramétrage par défaut).
Par défaut, un navigateur choisit une hauteur de ligne et une largeur de colonne correspondant à l'image la plus large ou à la ligne la plus longue dans une colonne. C’est pourquoi il arrive qu’une colonne de tableau devienne beaucoup plus large que les autres lorsque vous y ajoutez du contenu.
Annotation
Vous pouvez spécifier une hauteur en pourcentage de la hauteur totale du tableau, mais il se peut que la ligne ne s'affiche pas au pourcentage de hauteur spécifié dans les navigateurs.
Ar-pl
La couleur d'arrière-plan pour une cellule, une colonne ou une ligne, choisie avec le sélecteur de couleurs.
Fusionner les cellules
Combine les cellules, lignes ou colonnes sélectionnées en une seule cellule. Vous pouvez fusionner des cellules uniquement si elles forment un bloc rectangulaire ou linéaire.
Fractionner la cellule
Divise une cellule en deux ou plusieurs cellules. Vous ne pouvez diviser qu'une seule cellule à la fois ; ce bouton est désactivé si plusieurs cellules sont sélectionnées.
Pas de retour à la ligne auto
Empêche le retour à la ligne automatique, en conservant tout le texte d'une cellule donnée sur une seule ligne. Si Pas de retour à la ligne est activé, les cellules s'élargissent pour accommoder toutes les données au fur et à mesure que vous les saisissez ou les collez dans une cellule. (Normalement, les cellules s'étendent horizontalement pour accommoder le mot le plus long ou l'image la plus large dans la cellule, puis s'étendent verticalement selon les besoins pour accommoder le reste du contenu.)
En-tête
Formate les cellules sélectionnées comme des cellules d'en-tête de tableau. Le contenu des cellules d'en-tête de tableau est en gras et centré par défaut.
Annotation
Vous pouvez spécifier les largeurs et hauteurs soit en pixels soit en pourcentages, et vous pouvez convertir des pixels en pourcentages et inversement.
Annotation
Lorsque vous définissez des propriétés sur une colonne, Dreamweaver modifie les attributs de la balise td correspondant à chaque cellule de la colonne. Lorsque vous définissez certaines propriétés pour une ligne, cependant, Dreamweaver modifie les attributs de la balise tr plutôt que de modifier les attributs de chaque balise td dans la ligne. Lorsque vous appliquez le même format à toutes les cellules d'une ligne, l'application du format à la balise tr produit un code HTML plus propre et plus concis.
Appuyez sur Tabulation ou Entrée (Windows) ou Retour (Macintosh) pour appliquer la valeur.
Mise en forme de tableaux et de cellules
Vous pouvez modifier l'apparence des tableaux en définissant des propriétés pour le tableau et ses cellules ou en appliquant un design prédéfini au tableau. Avant de définir des propriétés de tableau et de cellule, sachez que l'ordre de priorité pour le formatage est cellules, lignes et tableaux.
Annotation
Pour formater le texte à l'intérieur d'une cellule de tableau, utilisez les mêmes procédures que vous utiliseriez pour formater le texte en dehors d'un tableau.
Modifier le format d'un tableau, d'une ligne, d'une cellule ou d'une colonne
Sélectionnez un tableau, une cellule, une ligne ou une colonne.
Dans l'Inspecteur de propriétés (Fenêtre > Propriétés), cliquez sur la flèche d'extension dans le coin inférieur droit et modifiez les propriétés si nécessaire.
Modifiez les propriétés de votre choix.
Pour plus d'informations sur les options, cliquez sur l'icône d'aide dans l'Inspecteur de propriétés.
Annotation
Lorsque vous définissez des propriétés sur une colonne, Dreamweaver modifie les attributs de la balise td correspondant à chaque cellule de la colonne. Lorsque vous définissez certaines propriétés pour une ligne, cependant, Dreamweaver modifie les attributs de la balise tr plutôt que de modifier les attributs de chaque balise td dans la ligne. Lorsque vous appliquez le même format à toutes les cellules d'une ligne, appliquer le format à la balise tr produit un code HTML plus propre et plus concis.
Ajouter ou modifier les valeurs d'accessibilité pour un tableau en mode Code
Modifiez les attributs appropriés dans le
code.
Annotation
Pour localiser rapidement les balises dans le code, cliquez dans le tableau, puis sélectionnez la balise <table> dans le sélecteur de balises en bas de la fenêtre document.
Ajouter ou modifier les valeurs d'accessibilité d'un tableau en mode Création
- Pour modifier la légende du tableau,
surlignez la légende et saisissez une nouvelle légende.
Pour modifier l'alignement de la légende, placez le point d'insertion dans la légende du tableau, cliquez avec le bouton droit (Windows) ou Ctrl+clic (Macintosh), puis sélectionnez Modifier le code de balise.
Pour modifier le résumé du tableau, sélectionnez le tableau, cliquez avec le bouton droit (Windows) ou faites un Ctrl+clic (Macintosh), puis sélectionnez Modifier le code de balise.
Redimensionnement de tableaux, de colonnes et de lignes
Redimensionnement des tableaux
Vous pouvez redimensionner un tableau entier ou des lignes et colonnes individuelles.Lorsque vous redimensionnez un tableau entier, toutes les cellules du tableau changent de taille proportionnellement.Si les cellules d'un tableau ont des largeurs ou hauteurs explicites spécifiées, le redimensionnement du tableau modifie la taille visuelle des cellules dans la fenêtre du document mais ne modifie pas les largeurs et hauteurs spécifiées des cellules.
Vous pouvez redimensionner un tableau en faisant glisser une de ses poignées de sélection.Dreamweaver affiche la largeur du tableau, ainsi qu'un menu d'en-tête de tableau, en haut ou en bas du tableau lorsque le tableau est sélectionné ou que le point d'insertion se trouve dans le tableau.
Parfois, les largeurs de colonnes définies dans le code HTML ne correspondent pas à leurs largeurs apparentes à l'écran.Lorsque cela se produit, vous pouvez uniformiser les largeurs.Les largeurs de tableau et de colonnes et les menus d'en-tête apparaissent dans Dreamweaver pour vous aider à mettre en page vos tableaux ; vous pouvez activer ou désactiver les largeurs et les menus selon vos besoins.
Redimensionnement des colonnes et des lignes
Vous pouvez modifier la largeur d'une colonne ou la hauteur d'une ligne dans l'inspecteur de propriétés ou en faisant glisser les bordures de la colonne ou de la ligne.Si vous avez des difficultés pour redimensionner, vous pouvez effacer les largeurs de colonnes ou les hauteurs de lignes et recommencer.
Annotation
Vous pouvez également modifier les largeurs et hauteurs de cellules directement dans le code HTML en mode Code.
Dreamweaver affiche les largeurs de colonnes, ainsi que les menus d'en-tête de colonnes, en haut ou en bas des colonnes lorsque le tableau est sélectionné ou que le point d'insertion se trouve dans le tableau ; vous pouvez activer ou désactiver les menus d'en-tête de colonnes selon vos besoins.
Redimensionnement d’un tableau
Sélectionnez le tableau. Si vous êtes en mode En direct, la vue Affichage d’élément apparaît dès que vous sélectionnez le tableau. Cliquez sur l'icône sandwich pour entrer en mode de formatage de tableau.
Pour redimensionner le tableau horizontalement, faites glisser la poignée de sélection à droite.
Pour redimensionner le tableau verticalement, faites glisser la poignée de sélection en bas.
Pour redimensionner le tableau dans les deux dimensions, faites glisser la poignée de sélection dans le coin inférieur droit.
Pour quitter le mode de mise en forme du tableau en mode En direct, appuyez sur la touche Echap ou cliquez en dehors du tableau. Vous pouvez utiliser les options du menu Édition > Tableau pour modifier davantage le tableau.
Remarque : les options figurant sous le menu Modifier > Tableau sont différentes selon que vous avez sélectionné tout le tableau ou une seule cellule. En mode En direct, la vue Affichage d’élément indique « table » lorsque tout le tableau est sélectionné et « td » lorsqu’une seule cellule est sélectionnée. Pour passer du mode de formatage de cellule au mode de formatage de tableau, cliquez sur la bordure du tableau.
Modifier la largeur d'une colonne et conserver la largeur globale du tableau
En mode Création, faites glisser la bordure droite de la colonne que vous voulez modifier.
La largeur de la colonne adjacente change également, vous redimensionnez donc en fait deux colonnes.Un retour visuel vous montre comment les colonnes vont s'ajuster ; la largeur globale du tableau ne change pas.
Annotation
Dans les tableaux avec des largeurs basées sur des pourcentages (non des pixels), si vous faites glisser la bordure droite de la colonne la plus à droite, la largeur de tout le tableau change, et toutes les colonnes deviennent plus larges ou se rétrécissent proportionnellement.
Modifier la largeur d'une colonne et conserver la taille des autres colonnes
En mode Création, maintenez la touche Maj enfoncée et faites glisser la bordure de la colonne.
Seule la largeur de cette colonne change. Les commentaires visuels indiquent comment les colonnes vont s'ajuster ; la largeur globale du tableau change pour s'adapter à la colonne que vous redimensionnez.
Modification de la hauteur d’une ligne visuellement
Faites glisser la bordure inférieure de la ligne.
Rendre les largeurs de colonnes du code cohérentes avec les largeurs visuelles
Cliquez dans une cellule.
Cliquez sur le menu d'en-tête du tableau, puis sélectionnez Rendre toutes les largeurs cohérentes.
Dreamweaver réinitialise la largeur spécifiée dans le code pour qu'elle corresponde à la largeur visuelle.
Effacer toutes les largeurs ou hauteurs définies dans un tableau
Sélectionnez le tableau.
Effectuez l’une des opérations suivantes :
Sélectionnez Édition > Tableau > Effacer les largeurs de cellules ou Édition > Tableau > Effacer les hauteurs de cellules.
Dans l'inspecteur Propriétés (Fenêtre > Propriétés), cliquez sur le bouton Effacer les hauteurs de ligne
ou sur le bouton Effacer les largeurs de colonne 
.Cliquez sur le menu d'en-tête du tableau, puis sélectionnez Clear All Heights ou Clear All Widths.
Effacement d’une largeur de colonne définie
Cliquez dans la colonne, cliquez sur le
menu d'en-tête de colonne, puis sélectionnez Effacer la largeur de colonne.
Activer ou désactiver les largeurs de tableaux et de colonnes et les menu en mode Création
Sélectionnez Affichage > Options du mode Création > Aides visuelles > Largeurs de tableau.
Ajout et suppression de lignes et de colonnes
Pour ajouter et supprimer des lignes et des colonnes, utilisez le menu Modifier > Tableau ou le menu d'en-tête de colonne.
Annotation
Appuyer sur Tab dans la dernière cellule d'un tableau ajoute automatiquement une autre ligne au tableau.
Ajout d’une ligne ou d’une colonne individuelle
Cliquez dans une cellule, puis procédez de l’une des manières suivantes :
Sélectionnez Édition > Tableau > Insérer une ligne ou Édition > Tableau > Insérer une colonne.
Une ligne apparaît au-dessus du point d'insertion ou une colonne apparaît à gauche du point d'insertion.
Cliquez sur le menu des en-têtes de colonne, puis choisissez Insérer une colonne à gauche ou Insérer une colonne à droite.
Ajout de plusieurs lignes ou colonnes
Cliquez dans une cellule.
Sélectionnez Édition > Tableau > Insérer des lignes ou des colonnes, complétez la boîte de dialogue, puis cliquez sur OK.
Insérer
Indique les lignes ou les colonnes à insérer.
Nombre de lignes ou Nombre de colonnes
Le nombre de lignes ou de colonnes à insérer.
Où
Spécifie si les nouvelles lignes ou colonnes doivent apparaître avant ou après la ligne ou colonne de la cellule sélectionnée.
Suppression d’une ligne ou d’une colonne
Effectuez l’une des tâches suivantes :
Cliquez dans une cellule de la ligne ou colonne que vous voulez supprimer, puis sélectionnez Édition > Tableau > Supprimer la ligne ou Édition > Tableau > Supprimer la colonne.
Sélectionnez une ligne ou colonne complète, puis appuyez sur Supprimer.
- Dans l’inspecteur Propriétés (Fenêtre > Propriétés), procédez de l’une des manières suivantes :
- Pour ajouter ou supprimer des lignes, augmentez ou réduisez la valeur indiquant le nombre de lignes.
- Pour ajouter ou supprimer des colonnes, augmentez ou réduisez la valeur correspondant au nombre de colonnes.
Annotation
Dreamweaver ne vous avertit pas si vous supprimez des lignes et colonnes qui contiennent des données.
Fractionnement et fusion de cellules
Utilisez l'Inspecteur de propriétés ou les options du sous-menu Édition > Tableau pour diviser ou fusionner des cellules.
Fusion de plusieurs cellules d’un tableau
Sélectionnez les cellules dans une ligne contiguë
et en forme de rectangle.
Dans l'illustration suivante, la sélection est un rectangle de cellules, les cellules peuvent donc être fusionnées.
Dans l'illustration suivante, la sélection n'est pas un rectangle, les cellules ne peuvent donc pas être fusionnées.
Effectuez l’une des opérations suivantes :
Sélectionnez Édition > Tableau > Fusionner les cellules.
Dans l'inspecteur de propriétés HTML développé (Fenêtre > Propriétés), cliquez sur Fusionner les cellules.
Annotation
Si vous ne voyez pas le bouton, cliquez sur la flèche de développement située dans le coin inférieur droit de l'inspecteur de propriétés pour afficher toutes les options.
Le contenu des cellules individuelles est placé dans la cellule produite par la fusion. Les propriétés de la première cellule sélectionnée sont appliquées à la cellule fusionnée.
Fractionnement d'une cellule
Cliquez dans la cellule et effectuez l'une des
opérations suivantes :
Sélectionnez Édition > Tableau > Fractionner la cellule.
Dans l'inspecteur de propriétés HTML développé (Fenêtre > Propriétés), cliquez sur Fractionner la cellule.
Annotation
Si le bouton n'est pas visible, cliquez sur la flèche de développement, dans le coin inférieur droit de l'inspecteur Propriétés, pour afficher toutes les options.
Dans la boîte de dialogue Fractionner la cellule, indiquez comment fractionner la
cellule :
Fractionner la cellule
Indique comment la cellule doit être fractionnée, en lignes ou en colonnes.
Nombre de lignes/Nombre de colonnes
Indique en combien de lignes ou de colonnes fractionner la cellule.
Augmenter ou réduire le nombre de lignes ou de colonnes sur lesquelles s'étend une cellule
Effectuez l’une des tâches suivantes :
Sélectionnez Édition > Tableau > Augmenter l'étendue de ligne, ou Édition > Tableau > Augmenter l'étendue de colonne.
Sélectionnez Édition > Tableau > Réduire l'étendue de ligne, ou Édition > Tableau > Réduire l'étendue de colonne.
Copie, collage et suppression de cellules
Vous pouvez copier, coller ou supprimer une cellule de tableau unique ou plusieurs cellules à la fois, en conservant le formatage des cellules.
Vous pouvez coller des cellules au point d'insertion ou à la place d'une sélection dans un tableau existant. Pour coller plusieurs cellules de tableau, le contenu du presse-papiers doit être compatible avec la structure du tableau ou la sélection dans le tableau dans lequel les cellules seront collées.
Découpage ou copie des cellules d’un tableau
Sélectionnez une ou plusieurs cellules dans une ligne
contiguë et en forme de rectangle.
Dans l'illustration suivante, la sélection est un rectangle de cellules, les cellules peuvent donc être coupées ou copiées.
Dans l'illustration suivante, la sélection n'est pas un rectangle, les cellules ne peuvent donc pas être coupées ou copiées.
Choisissez Edition > Couper ou Edition > Copier.
Annotation
Si vous avez sélectionné une ligne ou une colonne entière et que vous sélectionnez Édition > Couper, la ligne ou la colonne entière est supprimée du tableau (pas seulement le contenu des cellules).
Collage de cellules d’un tableau
Choisissez l’emplacement où coller les cellules :
Pour remplacer des cellules existantes par les cellules que vous collez, sélectionnez une série de cellules existantes dont la mise en forme est la même que celle des cellules du Presse-papiers. (Par exemple, si vous avez copié ou coupé un bloc de 3 x 2 cellules, vous pouvez sélectionner un autre bloc de 3 x 2 cellules pour le remplacer par les cellules collées.)
Pour coller une ligne entière de cellules au-dessus d'une cellule spécifique, cliquez dans celle-ci.
Pour coller une colonne entière de cellules à gauche d'une cellule spécifique, cliquez dans celle-ci.
Annotation
Si vous avez placé moins d'une ligne ou d'une colonne entière dans le Presse-papiers et que vous cliquez dans une cellule puis collez les cellules figurant dans le Presse-papiers, alors il se peut que la cellule dans laquelle vous avez cliqué et les cellules voisines (selon leur emplacement dans le tableau) soient remplacées par les cellules que vous avez collées.
- Pour créer un nouveau tableau avec les cellules collées, placez le point d'insertion hors du tableau.
Choisissez Edition > Coller.
Si vous collez des lignes ou des colonnes entières dans un tableau existant, les lignes ou les colonnes sont ajoutées au tableau. Si vous collez une seule cellule, le contenu de la cellule sélectionnée est remplacé.Si vous collez à l'extérieur d'un tableau, les lignes, les colonnes ou les cellules sont utilisées pour définir un nouveau tableau.
Supprimer le contenu des cellules mais laisser les cellules intactes
Sélectionnez une ou plusieurs cellules.
Annotation
Assurez-vous que la sélection ne se compose pas entièrement de lignes ou de colonnes complètes.
Appuyez sur Supprimer.
Annotation
Si seules des lignes ou des colonnes complètes sont sélectionnées lorsque vous sélectionnez Édition > Effacer ou appuyez sur Supprimer, les lignes ou colonnes entières—pas seulement leur contenu—sont supprimées du tableau.
Supprimez les lignes ou les colonnes qui contiennent des cellules fusionnées
Sélectionnez une ligne ou une colonne.
Sélectionnez Édition > Tableau > Supprimer la ligne ou Édition > Tableau > Supprimer la colonne.
Imbrication de tableaux
Un tableau imbriqué est un tableau à l'intérieur d'une cellule d'un autre tableau.Vous pouvez mettre en forme un tableau imbriqué comme n'importe quel autre tableau ; cependant, sa largeur est limitée par la largeur de la cellule dans laquelle il apparaît.
Cliquez dans une cellule du tableau.
Sélectionnez Insertion > Tableau, définissez les options d'insertion de tableau et cliquez sur OK.
Tri de tableaux
Vous pouvez trier les lignes d'un tableau en fonction du contenu d'une seule colonne. Vous pouvez également effectuer un tri de tableau plus complexe basé sur le contenu de deux colonnes.
Vous ne pouvez pas trier les tableaux qui contiennent des attributs colspan ou rowspan, c'est-à-dire les tableaux qui contiennent des cellules fusionnées.
Sélectionnez le tableau ou cliquez dans une cellule.
Sélectionnez Édition > Tableau > Trier le tableau, définissez les options dans la boîte de dialogue et cliquez sur OK.
Trier par
Détermine la colonne dont les valeurs seront utilisées pour trier les lignes du tableau.
Ordre
Détermine s'il faut trier la colonne par ordre alphabétique ou numérique, et s'il faut la trier par ordre croissant (A à Z, nombres inférieurs aux nombres supérieurs) ou décroissant.
Lorsque le contenu d'une colonne est constitué de nombres, sélectionnez Numériquement.Un tri alphabétique appliqué à une liste de nombres à un et deux chiffres a pour résultat que les nombres sont triés comme s'ils étaient des mots (ce qui donne un ordre tel que 1, 10, 2, 20, 3, 30) plutôt que d'être triés comme des nombres (ce qui donne un ordre tel que 1, 2, 3, 10, 20, 30).
Puis par/Ordre
Détermine l'ordre de tri pour un tri secondaire sur une colonne différente. Spécifiez la colonne de tri secondaire dans le menu contextuel Puis par, et l'ordre de tri secondaire dans les menus contextuels Ordre.
Inclure la première ligne dans le tri
Spécifie que la première ligne du tableau doit être incluse dans le tri. Si la première ligne est un en-tête qui ne doit pas être déplacé, ne sélectionnez pas cette option.
Trier les lignes d’en-tête
Spécifie de trier toutes les lignes de la section thead du tableau (le cas échéant) en utilisant les mêmes critères que les lignes du corps. (Notez que les lignes thead restent dans la section thead et apparaissent toujours en haut du tableau même après le tri.) Pour plus d'informations sur la balise thead, consultez le panneau Référence (sélectionnez Aide > Référence).
Trier les lignes de pied de page
Spécifie de trier toutes les lignes de la section tfoot du tableau (le cas échéant) en utilisant les mêmes critères que les lignes du corps. (Notez que les lignes tfoot restent dans la section tfoot et apparaissent toujours en bas du tableau même après le tri.) Pour plus d'informations sur la balise tfoot, consultez le panneau Référence (sélectionnez Aide > Référence).
Conserver les couleurs des lignes après le tri
Spécifie que les attributs de ligne de tableau (comme la couleur) doivent rester associés au même contenu après le tri. Si vos lignes de tableau sont formatées avec deux couleurs alternées, ne sélectionnez pas cette option pour vous assurer que le tableau trié a toujours des lignes de couleurs alternées. Si les attributs de ligne sont spécifiques au contenu de chaque ligne, sélectionnez cette option pour vous assurer que ces attributs restent associés aux lignes correctes dans le tableau trié.
Créez de magnifiques sites web dans Dreamweaver
Concevez, codez et gérez des sites web dynamiques dans un puissant outil tout-en-un.
