Catégories: Culture
|
13 avril 2020 19 h 00 min

Comment créer un tableau avec des balises HTML ?

Partager

Définition Un tableau se compose de cellules (cases).
Ces cellules sont disposées en rangées (cases alignées horizontalement) et en colonnes rangées (cases alignées verticalement).
(cf.
image 1).
Éléments de base de la création d’un tableau Pour créer un tableau simple en HTML, 4 balises (instructions) sont essentielles : Table est la balise indiquant le début du tableau.

Tr (table row) rassemble les cellules d’une même rangée.
Td (table data) accède au contenu d’une cellule.
Th (table heading) affiche des titres centrés et en gras.
Possède les mêmes attributs que l’élément td.
Passons à la pratique Dans cet exemple, nous avons un tableau composé de 2 rangées.
La première comprend 3 cellules affichant un texte (Titre) centré et en gras.
La seconde comprend aussi 3 cellules, mais cette fois avec un texte dont la mise en forme est simple, le texte est toujours placé à gauche (état par défaut).
(cf.
image 2) Un détail vous étonne ? Oui, ce tableau est sans bordure.
Alors, voyons comment pallier ce manque.

Principaux attributs Afin de paramétrer votre tableau, vous pouvez ajouter certains éléments associés à des valeurs.
Ces éléments s’appellent des « attributs ».
(cf.
image 3) Border affiche un tableau avec une bordure en pixels.
Width définit la largeur totale du tableau (en pixels ou en pourcentage).
Height définit la hauteur totale du tableau (en pixels ou en pourcentage).
Cellspacing détermine l’espacement entre les bords de deux cellules voisines.
Cellpadding détermine l’espacement entre le bord des cellules et leur contenu.
Align précise l’alignement horizontal.
Il peut prendre les valeurs suivantes : left, right ou center.
Valign précise l’alignement vertical.
Peut prendre les valeurs top, middleou bottom(à utiliser avec height).
Deux attributs supplémentaires permettent la fusion des cellules (cf.
image 4) : Colspan indique le nombre de cellules fusionnées horizontalement.
Rowspan indique le nombre de cellules fusionnées verticalement.
Il est aussi facile d’agrémenter ses tableaux par la couleur et les images.
(cf.
images 5 et 6).
Vaste est l’étendue des possibilités offertes par les tableaux, alors n’attendez pas pour faire vos expérimentations.

Les plus lus

Une guide pratique pour retrouver une personne avec simplement son prénom et sa ville avec l'aide des réseaux sociaux.

Gaspard Ulliel : ses proches lui rendront un dernier hommage le 27 janvier 2022.

Le succès mondial "La danse des canards", avec 3,5 millions de disques vendus, classée comme hit parade à plusieurs reprises, a perdu son auteur.

Le musée du Louvre abrite des œuvres d'art d'une immense valeur et tous ceux qui se rendent à Paris doivent le visiter.