Exemple
Une table de HTML simple avec deux cellules d'en-tête et deux cellules de données:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Essayez - le vous - même » Plus "Try it yourself" exemples ci-dessous.
Définition et utilisation
Le <th> tag définit une cellule d' en- tête dans un tableau HTML.
Un tableau HTML a deux types de cellules:
- Les cellules d' en- tête - contient des informations d' en- tête (créé avec le <th> élément)
- Cellules standard - contient des données (créé avec le <td> élément)
Le texte <th> éléments sont en gras et centré par défaut.
Le texte <td> éléments sont réguliers et aligné à gauche par défaut.
support du navigateur
| Élément | |||||
|---|---|---|---|---|---|
| <th> | Oui | Oui | Oui | Oui | Oui |
Trucs et astuces
Astuce: Utilisez le colspan et rowspan attribut pour laisser le contenu portée sur plusieurs colonnes ou lignes!
Différences entre HTML 4.01 et HTML5
Tous les attributs de mise en page sont supprimés en HTML5.
Les attributs
| Attribut | Valeur | La description |
|---|---|---|
| abbr | text | Indique une version abrégée du contenu dans une cellule d'en-tête |
| align | left right center justify char | Non pris en charge en HTML5. Aligne le contenu dans une cellule d'en-tête |
| axis | category_name | Non pris en charge en HTML5. Catégorise les cellules d'en-tête |
| bgcolor | rgb(x,x,x) #xxxxxx colorname | Non pris en charge en HTML5. Indique la couleur d'une cellule d'en-tête d'arrière-plan |
| char | character | Non pris en charge en HTML5. Aligne le contenu dans une cellule d'en-tête d'un personnage |
| charoff | number | Non pris en charge en HTML5. Définit le nombre de caractères du contenu sera aligné à partir du caractère spécifié par l' char attribut |
| colspan | number | Indique le nombre de colonnes d'une cellule d'en-tête doit enjamber |
| headers | header_id | Spécifie une ou plusieurs cellules d'en-tête d'une cellule est liée à |
| height | pixels % | Non pris en charge en HTML5. Définit la hauteur d'une cellule d'en-tête |
| nowrap | nowrap | Non pris en charge en HTML5. Indique que le contenu dans une cellule d'en-tête ne doit pas envelopper |
| rowspan | number | Indique le nombre de lignes d'une cellule d'en-tête doit enjamber |
| scope | col colgroup row rowgroup | Indique si une cellule d'en-tête est un en-tête d'une colonne, une ligne ou un groupe de colonnes ou de lignes |
| sorted | reversed number reversed number number reversed | Définit la direction de tri d'une colonne |
| valign | top middle bottom baseline | Non pris en charge en HTML5. Vertical aligne le contenu dans une cellule d'en-tête |
| width | pixels % | Non pris en charge en HTML5. Indique la largeur d'une cellule d'en-tête |
Attributs globaux
Le <th> tag soutient également le attributs globaux en HTML .
Attributs de l'événement
Le <th> tag supporte aussi les Attributs d' événements en HTML .
Essayez-le vous-même - Exemples
Têtes de table
Comment créer des en-têtes de table.
Table avec une légende
Un tableau HTML avec une légende.
Mots - clefs à l' intérieur d' une table
Comment afficher des éléments à l'intérieur d'autres éléments.
C aunes qui couvrent plus d'une ligne / colonne
Comment définir des cellules de tableau qui couvrent plus d'une ligne ou une colonne.
Pages associées
HTML tutoriel: tableaux HTML
Référence HTML DOM: TableHeader Object
Tutoriel CSS: Tableaux coiffants
Paramètres par défaut de CSS
La plupart des navigateurs affichent le <th> élément avec les valeurs par défaut suivantes:
th {
display: table-cell;
vertical-align: inherit;
font-weight: bold;
text-align: center;
}