<colgroup> : l'élément regroupant des colonnes
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
L'élément HTML <colgroup>
définit un groupe de colonnes au sein d'un tableau.
Exemple interactif
Catégories de contenu | Aucune. |
---|---|
Contenu autorisé |
Si l'attribut span est présent :
aucun car c'est un élément vide.Si l'attribut n'est pas présent, zéro ou plusieurs éléments <col> .
|
Omission de balises |
La balise de début peut être absente si le premier élément fils est
<col> et
que celui-ci n'est pas précédé par un élément
<colgroup>
dont la balise de fin est absente. La balise de fin peut être absente
s'il n'est pas suivi par un blanc ou par un commentaire.
|
Parents autorisés |
Un élément
<table> .
<colgroup>
doit apparaître après tout élément
<caption>
optionnel et avant tout élément
<thead> , <th> ,
<tbody> ,
<tfoot>
et <tr> .
|
Rôle ARIA implicite | Pas de rôle correspondant |
Rôles ARIA autorisés | Aucun rôle autorisé. |
Interface DOM |
HTMLTableColElement
|
Attributs
Comme pour tous les éléments, on peut utiliser les attributs universels sur cet élément.
span
-
Cet attribut contient un nombre entier positif indiquant le nombre de colonnes consécutives que l'élément
<colgroup>
couvre. S'il n'est pas présent, sa valeur par défaut est1
.Note : Cet attribut est appliqué sur les attributs du groupe de colonnes, il n'a aucun effet sur les règles de style CSS qui lui sont associées ni, a fortiori, sur les cellules des membres du groupe de la colonne.
- L'attribut
span
n'est pas autorisé s'il y a un ou plusieurs éléments<col>
dans le<colgroup>
.
- L'attribut
Attributs dépréciés
Les attributs suivants sont dépréciés et ne doivent pas être utilisés. Ils sont documentés ci-dessous à titre de référence lors de la mise à jour du code existant et uniquement pour des raisons historiques.
align
Obsolète-
Cet attribut de type énumératif indique comment l'alignement horizontal du contenu des cellules de chaque colonne sera traité. Les valeurs possibles sont :
left
, aligner le contenu à gauche de la cellulecenter
, centrer le contenu dans la celluleright
, aligner le contenu à droite de la cellulejustify
, insérer des espaces dans le contenu textuel afin que le contenu soit justifié dans la cellulechar
, aligner le contenu textuel sur un caractère spécial avec un décalage minimal, défini par les attributschar
etcharoff
.
Si cet attribut n'est pas défini, la valeur
left
est adoptée. Les éléments<col>
descendants peuvent remplacer cette valeur en utilisant leur propre attributalign
.Note :
- N'essayez pas de définir la propriété
text-align
sur un sélecteur donnant un élément<colgroup>
. Comme les éléments<td>
ne sont pas des descendants de l'élément<colgroup>
, ils n'en hériteront pas. - Si le tableau n'utilise pas d'attribut code>colspan, utilisez un
td:nth-child(an+b)
sélecteur CSS par colonne, où a est le nombre total de colonnes du tableau et b est la position ordinale de cette colonne dans le tableau. Ce n'est qu'après ce sélecteur que la propriététext-align
peut être utilisée. - Si le tableau utilise bien un attribut
colspan
, l'effet peut être obtenu en combinant des sélecteurs d'attributs CSS adéquats comme[colspan=n]
, bien que cela ne soit pas trivial.
bgcolor
Obsolète-
La couleur de fond du tableau. Il s'agit d'un code RVB hexadécimal à 6 chiffres, préfixé par un «
#
». L'un des mots-clés de couleur prédéfinis peut également être utilisé.Pour obtenir un effet similaire, utilisez la propriété CSS
background-color
. char
Obsolète-
Cet attribut spécifie l'alignement du contenu d'un groupe de colonnes sur un caractère. Les valeurs typiques de cet attribut comprennent un point (.) lorsqu'on tente d'aligner des chiffres ou des valeurs monétaires. Si
align
n'est pas défini surchar
, cet attribut est ignoré, bien qu'il sera toujours utilisé comme valeur par défaut pour lealign
du<col>
qui sont membres de ce groupe de colonnes. charoff
Obsolète-
Cet attribut est utilisé pour indiquer le nombre de caractères pour décaler les données de la colonne par rapport au caractère d'alignement spécifié par l'attribut
char
. valign
Obsolète-
Cet attribut spécifie l'alignement vertical du texte dans chaque cellule de la colonne. Les valeurs possibles de cet attribut sont les suivantes :
baseline
, mettra le texte aussi près du bas de la cellule que possible, mais l'alignera sur la ligne de base des caractères au lieu du bas de ceux-ci. Si les caractères sont tous de la même taille, cela a le même effet quebottom
;bottom
, placera le texte aussi près du bas de la cellule que possible ;middle
, permet de centrer le texte dans la cellule ;- and
top
, placera le texte aussi près du haut de la cellule que possible.
Note :
- N'essayez pas de définir la propriété
vertical-align
sur un sélecteur donnant un élément<col>
. Comme les éléments<td>
ne sont pas des descendants de l'élément<col>
, ils n'en hériteront pas. - Si le tableau n'utilise pas d'attribut
colspan
, utilisez le sélecteur CSStd:nth-child(an+b)
où a est le nombre total de colonnes du tableau et b la position ordinale de la colonne dans le tableau. Ce n'est qu'après ce sélecteur que la propriétévertical-align
peut être utilisée. - Si le tableau utilise bien un attribut
colspan
, l'effet peut être obtenu en combinant des sélecteurs d'attributs CSS adéquats comme[colspan=n]
, bien que cela ne soit pas trivial.
Exemples
Veuillez consulter la page <table>
pour des exemples sur <colgroup>
.
Spécifications
Specification |
---|
HTML Standard # the-colgroup-element |
Compatibilité des navigateurs
BCD tables only load in the browser
Voir aussi
-
Les propriétés et pseudo-classes CSS notamment utiles pour mettre en forme l'élément
<col>
:- la propriété
width
pour contrôler la largeur de la colonne ; - la pseudo-classe
:nth-child
pour définir l'alignement des cellules de la colonne ; - la propriété
text-align
pour aligner le contenu de toutes les cellules sur le même caractère, comme « . ».
- la propriété