Tag HTML <tr>

Le tag HTML <tr> définit les lignes dans la table. Les cellules de la ligne sont spécifiées par les tags <th> (cellule d'en-tête) ou <td> (cellule standard).

L’élément <tr> est utilisé dans le tag <table>.

Notez que toutes les lignes de la table contiennent le même nombre de cellules, ce qui correspond au nombre de cellules de la plus longue ligne. S'il y a moins de cellules dans une ligne que dans les autres lignes, le navigateur remplit automatiquement la ligne en plaçant des cellules vides à la fin de la même ligne.

Syntaxe

<table> 
  <tr> 
    <td>...</td> 
  </tr> 
</table>

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      th, td {
        padding: 10px;
        border: 1px solid #666;
      }
    </style>
  </head>
   <body>
    <table style="width:80%; margin:30px auto; border-collapse:collapse;">
      <tr>
        <th>Mois</th>
        <th>Date</th>
      </tr>
      <tr>
        <td>Mars</td>
        <td>10.09.2018</td>
      </tr>
      <tr>
        <td>Juin</td>
        <td>18.07.2018</td>
      </tr>
    </table>
  </body>
</html>

Résultat

Attributs

Attribut Valeur Description
align right
left
center
justify
char
Indique comment aligner le contenu des cellules.
Non supporté en HTML5.
bgcolor bgcolor Spécifie la couleur d'arrière-plan des cellules.
Non supporté en HTML5.
bordercolor bordercolor Définit le couleur du cadre.
Non supporté en HTML5.
char character Spécifie comment aligner le contenu des cellules avec le caractère spécifié. Utilisé uniquement si l'attribut align = "char".
Non supporté en HTML5.
charoff number Décale le contenu des cellules par rapport au caractère spécifié. Utilisé si l'attribut align = "char".
Non supporté en HTML5.
valign top
middle
bottom
baseline
Aligne le contenu dans l’élément verticalement.
Non supporté en HTML5.

Le tag <tr> supporte également les Attributs globaux et les Attributs d'événements.

Comment styler le tag HTML <tr> ?

Propriétés communes pour modifier le poids visuel/emphase/taille du texte dans le tag <tr>:

Coloration du texte dans le tag HTML <tr>:

Styles de mise en page du texte pour la tag HTML <tr>:

Autres propriétés utiles pour le tag HTML <tr>:


Support de Navigateurs



Trouvez-vous cela utile?

Articles Associées