HTML tableaux

Tableaux HTML

Pommes	44%
Bananes	23%
Oranges	13%
Autre	10%

---

Essayez vous-même - Exemples

Tableaux
comment créer des tables dans un document HTML.

Tableau borde
Comment spécifier les bordures du tableau différentes.

(Vous pouvez trouver plus d'exemples au bas de cette page).

---

Tableaux HTML

Les tableaux sont définis avec la balise <table>.

Une table est divisée en rangées (avec la balise <tr>), et chaque rangée est divisée en cellules de données (par la balise <td>). td signifie "des données de table," et comporte le contenu d'une cellule de données. Une balise <td> peut contenir du texte, liens, images, listes, formulaires, tableaux d'autres, etc

Exemple de table

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Comment le code HTML ci-dessus porte dans un navigateur:

la ligne 1, la cellule 1	la ligne 1, cellule 2
ligne 2, la cellule 1	ligne 2, la cellule 2

---

Tableaux HTML et l'attribut border

Si vous ne spécifiez pas un attribut de la frontière, le tableau sera affiché sans frontières. Parfois, cela peut être utile, mais la plupart du temps, nous voulons que les frontières de montrer.

Pour afficher une table avec des bordures, spécifiez l'attribut border:

<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>

---

En-têtes de tableau HTML

Informations d'en-tête dans un tableau sont définies avec la balise <th>.

Tous les principaux navigateurs afficher le texte dans l'élément <th> en gras et centré.

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Comment le code HTML ci-dessus porte sur votre navigateur:

En-tête 1	En-tête 2
la ligne 1, la cellule 1	la ligne 1, cellule 2
ligne 2, la cellule 1	ligne 2, la cellule 2

---

Exemples

Tables sans frontières
comment créer des tables sans frontières.

Tableau têtes
Comment créer des têtes de table.

Tableau avec une légende
Comment faire pour ajouter une légende à une table.

Les cellules de tableau qui s'étendent sur ​​plus d'une ligne / colonne
Comment définir les cellules du tableau qui s'étendent sur ​​plus d'une ligne ou une colonne.

Mots clés à l'intérieur d'une table
Comment afficher les éléments à l'intérieur d'autres éléments.

Marge intérieure des cellules
Comment utiliser cellpadding pour créer plus d'espace blanc entre le contenu de la cellule et de ses frontières.

Cellule espacement
Comment utiliser cellspacing pour augmenter la distance entre les cellules.

Le cadre attribuer
Comment utiliser le "cadre" attribut pour contrôler les frontières autour de la table.

---

Balises de tableau HTML

Balise	Description
<table>	Définit une table
<th>	Définit un en-tête de table
<tr>	Définit une ligne de tableau
<td>	Définit une cellule de tableau
<caption>	Définit une légende de la table
<colgroup>	Définit un groupe de colonnes dans un tableau, pour le formatage
<col />	Définit les valeurs d'attribut pour un ou plusieurs colonnes dans une table
<thead>	Groupes de contenu en-tête dans un tableau
<tbody>	Groupes du contenu du corps dans un tableau
<tfoot>	Groupes le contenu de bas de page dans un tableau