Introduction
Les tableaux peuvent être utilisés pour présenter des données dans un format structuré. Le composant de base de tout tableau est un élément de ligne de tableau (
) et la deuxième ligne contient deux cellules de données ( | ).
Ajout de plus de lignesPour ajouter plus de lignes au tableau, nous devons ajouter plus d'éléments
Maintenant, le tableau a trois lignes, avec deux cellules par ligne. Stylisation des lignes de tableauNous pouvons ajouter des styles aux lignes de tableau à l'aide de CSS. Ajoutez le style suivant à l'élément pour ajouter une couleur d'arrière-plan aux lignes paires :
Ce code ajoutera une couleur d'arrière-plan Fusion de lignes de tableauNous pouvons fusionner deux lignes ou plus adjacentes en une seule ligne en utilisant l'attribut rowspan. Par exemple, disons que nous voulons fusionner les deux premières lignes en une seule ligne. Remplacez le premier élément
L'attribut Création d'en-têtes de cellules de tableauNous pouvons utiliser l'élément pour créer des cellules d'en-tête dans le tableau. Les cellules d'en-tête sont généralement utilisées pour décrire le contenu des colonnes. Pour ajouter une cellule d'en-tête à la première colonne, remplacez le premier élément | de la deuxième ligne par le code suivant :
|
L'attribut spécifie que cette cellule est un en-tête pour la première ligne.
| SommaireDans ce laboratoire, nous avons appris à créer des lignes de tableau HTML et à personnaliser le tableau à l'aide de CSS. Nous avons également appris à fusionner des lignes adjacentes et à créer des cellules d'en-tête dans le tableau. Avec ces compétences, vous pouvez désormais créer des tableaux beaux et structurés pour vos pages web. |
---|