HTML - Les tableaux

Utilisation de tableaux

Il est souvent utile de présenter des informations mieux structurées qu'avec des listes. Les tableaux permettent de les afficher en lignes et en colonnes. Les tableaux sont définis comme étant des suites de lignes.

Un tableau doit respecter les quelques règles suivantes :

• Le tableau est encadré par les balises <TABLE> et </TABLE>.
• Le titre du tableau est encadré par <CAPTION> </CAPTION>
• Chaque ligne est encadrée par <TR> </TR> (Table Row, traduisez par ligne du tableau).
• Les cellules d'en-tête sont encadrées par <TH> </TH> (pour Table Header : En-tête de tableau)
• Les cellules de valeur sont encadrées par <TD> </TD> (Table Data: Donnée de tableau)

Voici un exemple de tableau HTML :

<TABLE BORDER="1">
  <CAPTION> Voici le titre du tableau </CAPTION>
  <TR>
	<TH> Titre A1 </TH>
	<TH> Titre A2 </TH>
	<TH> Titre A3 </TH>
	<TH> Titre A4 </TH>
  </TR>
  <TR>
	<TH> Titre B1 </TH>
	<TD> Valeur B2 </TD>
	<TD> Valeur B3 </TD>
	<TD> Valeur B4 </TD>
  </TR>
</TABLE> 

Ce code donne le résultat suivant :

Voici le titre du tableau

Titre A1	Titre A2	Titre A3	Titre A4
Titre B1	Valeur B2	Valeur B3	Valeur B4

Les attributs

Attribut	Balises auxquelles il s'applique	Valeur	Effet Visuel
ALIGN	THEAD TBODY TH TR TD	CENTER LEFT RIGHT JUSTIFY	centré Gauche Droite Justifié
	CAPTION	TOP BOTTOM	Au-dessus En-dessous
VALIGN (alignement vertical)	THEAD TBODY TH TR TD	TOP MIDDLE BOTTOM	En haut Au milieu En bas
BORDER=n	TABLE		Taille de la bordure
CELLPADDING=n	TABLE		Espacement de n pixels entre le contenu des cellules et la bordure
CELLSPACING=n	TABLE		Epaisseur de la grille intérieure
FLOAT	TABLE	RIGHT LEFT	Position du texte qui suivra </TABLE>
COLS=n	TABLE		Nombre de colonnes
FRAME (contrôle les éléments individuels d'encadrement du tableau)	TABLE	NONE TOP BOTTOM TOPBOT SIDES ALL	Aucun au-dessus En bas Tout en haut Sur les cotés Tous
RULES (contrôle les éléments de la grille des cellules)	TABLE	NONE BASIC ROWS COLS ALL	Aucun basique Ligne Colonne Tous
COLSPAN	THEAD TBODY TH TR TD		Débordement des cellules sur les colonnes adjacentes
ROWSPAN	THEAD TBODY TH TR TD		Débordement des cellules sur les lignes adjacentes

Trucs & astuces pertinents trouvés dans la base de connaissances

23/01 15h45	Comment aspirer un site Web ? (Web)
22/11 13h03	On peut protéger une page web/une image contre la copie (Mythes et légendes)
24/09 01h59	-Un document de référence (HTML)
11/04 15h03	Convertir une page en PDF - Méthode simple (Webmaster)
27/01 09h18	Récupérer un site web en .chm (Windows Help) (Téléchargement)
Plus d'astuces sur « HTML »

Discussions pertinentes trouvées dans le forum

18/08 11h52	[HTML] texte à la verticale	Webmastering	02/02 09h42->saber	18
27/01 16h00	boutons pour ouvrir ou enregistrer un cv html	Développement	14/02 11h12->younalive	12
19/03 16h14	html : input type=submit	Webmastering	22/03 13h56->Bobinours	4
22/12 23h48	Virus Exploit.Html.Codebase.Exec.Gen	Virus/Sécurité	20/09 20h51->Manu	59
04/02 19h08	recherche [balise] pour frise HTML	Développement	14/02 21h00->Laurent	38
17/06 11h10	rss et html : commentaire (en français) svp !	Webmastering	04/07 14h21->bg62	32
17/04 03h20	Comment faire un serveur html	Internet	19/02 15h11->loutalie	26
30/12 12h13	problème avec secure32.html	Virus/Sécurité	13/01 08h15->martinicmiel	21
26/07 16h22	Firefox infecté par Trojan-Spy.HTML.Bayfraud.	Virus/Sécurité	03/08 21h11->Regis59	20
17/08 01h45	Je craque: html-php case à cocher + sélection	Développement	21/08 22h43->franck	20
Discussion fermée Problème résolu		Plus de discussions sur « HTML »