HTML

Utilisation de <tr> pour les lignes, <th> pour les en-têtes et <td> pour les cellules

Utilisation de <tr> pour les lignes, <th> pour les en-têtes et <td> pour les cellules


Dans un tableau HTML, la balise <tr> est utilisée pour définir chaque ligne du tableau, <th> est utilisée pour définir les en-têtes de colonne et <td> est utilisée pour définir les cellules de données. Voici comment les utiliser :


1. Utilisation de <tr> pour les lignes :

  • La balise <tr> (table row) est utilisée pour définir chaque ligne du tableau.
  • Chaque balise <tr> englobe les cellules de données <td> ou les en-têtes de colonne <th>.
  • Exemple :


<table>
  <tr>
    <td>Cellule 1</td>
    <td>Cellule 2</td>
    <td>Cellule 3</td>
  </tr>
  <tr>
    <td>Cellule 4</td>
    <td>Cellule 5</td>
    <td>Cellule 6</td>
  </tr>
</table>


2. Utilisation de <th> pour les en-têtes de colonne :


  • La balise <th> (table header) est utilisée pour définir les en-têtes de colonne du tableau.
  • Ces en-têtes sont généralement affichés en gras et centrés par défaut.
  • Exemple :


<table>
  <tr>
    <th>En-tête 1</th>
    <th>En-tête 2</th>
    <th>En-tête 3</th>
  </tr>
  <tr>
    <td>Cellule 1</td>
    <td>Cellule 2</td>
    <td>Cellule 3</td>
  </tr>
</table>


3. Utilisation de <td> pour les cellules de données :


  • La balise <td> (table data) est utilisée pour définir les cellules de données du tableau.
  • Ces cellules contiennent les données réelles du tableau.
  • Exemple :


<table>
  <tr>
    <td>Donnée 1</td>
    <td>Donnée 2</td>
    <td>Donnée 3</td>
  </tr>
  <tr>
    <td>Donnée 4</td>
    <td>Donnée 5</td>
    <td>Donnée 6</td>
  </tr>
</table>


Conseils d'utilisation :


  • Utilisez <tr> pour chaque ligne du tableau, <th> pour les en-têtes de colonne et <td> pour les cellules de données.
  • Utilisez des attributs comme colspan ou rowspan pour fusionner des cellules si nécessaire.
  • N'utilisez pas les tableaux pour la mise en page, préférez les CSS pour cela.


Conclusion :


En utilisant les balises <tr> pour les lignes, <th> pour les en-têtes et <td> pour les cellules dans votre fichier HTML, vous pouvez créer des tableaux bien structurés pour afficher des données tabulaires de manière claire et organisée. Assurez-vous d'utiliser ces balises correctement pour garantir une meilleure accessibilité et une meilleure présentation de vos données tabulaires.

987 vues
Posté le 19 février 2024
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
2 060 vues
Personnaliser ses conversations
Dans cette dernière vidéo nous allons personnaliser notre messagerie ! 😎Pour cela nous allons donner l’aspect des conversations comme une messagerie de smartphone type Apple ou Samsung.Nous...
Créer son site de rencontres
2 146 vues
Mixins : Créer des mixins pour réutiliser des blocs de styles
Mixins en SASS : Créer et Utiliser1. Déclaration de mixins :En SASS, les mixins sont déclarés à l'aide du mot-clé @mixin, suivi du nom du mixin et des paramètres entre parenthèses. Les styles...
Sass
638 vues
Tableaux : création, accès aux éléments, méthodes
Tableaux en JavaScript1. Création de Tableaux :Un tableau en JavaScript est une structure de données permettant de stocker plusieurs valeurs dans une seule variable. Vous pouvez créer un tableau...
JS
11 497 vues
Afficher tous vos utilisateurs
Dans cet article nous allons afficher tous les utilisateurs de notre base de données afin qu'un utilisateur puisse accéder à n'importe quel profil d'un autre utilisateur par la...
Créer son site
655 vues
Les callbacks
Les Callbacks en JavaScriptLes callbacks sont des fonctions passées en tant qu'arguments à d'autres fonctions, qui seront exécutées ultérieurement ou de manière asynchrone. Les callbacks sont...
JS
4 687 vues
Variables : Déclarer et utiliser des variables pour stocker des valeurs réutilisables
Variables en SASS : Déclarer et Utiliser1. Déclaration de variables :En SASS, les variables commencent par le symbole $ suivi du nom de la variable et de sa valeur. Par exemple :$primary-color:...
Sass
1 888 vues
Voir plus de messages (1/2)
Dans cette nouvelle vidéo nous allons ajouter un bouton 'voir plus' qui va nous permettre de voir d'anciens messages. Nous allons commencer par mettre en place le bouton suivi du procédé pour voir...
Créer son site de rencontres
4 858 vues
Le langage CSS
Le CSS permet de concevoir le design de votre site web. Le CSS agit sur des éléments HTML.On peut intégrer le CSS de deux façons :Directement sur les éléments de votre HTML,Mettre le...
Créer son site
Publicité
Cette pub permet au site de vivre ...