Tag HTML <colgroup>

❮ Précédent Suivant ❯

Le tag <colgroup> spécifie un groupe de colonnes dans une table avec des propriétés communes. Le tag peut inclure plusieurs éléments <col> qui définissent des propriétés de colonne.

Syntaxe

Le tag <colgroup> est apparié, le tag fermant </colgroup> est requis.

Le tag <colgroup> est placé dans le tag <table> avant les tags <thead>, <tbody>, <tfoot> et <tr> et après le tag <caption>, s’il est utilisé (dans le tag <caption> on met les noms des tables).

Dans un seul tableau HTML, vous pouvez inclure plusieurs tags <colgroup>.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      table, th, td {
        border: 1px solid #666;
      }
    </style>
  </head>
  <body>
    <table>
      <colgroup>
        <col span="2" style=" width:20%; background-color:#eee;">
        <col style="width:10%; background-color:#8ebf42;">
      </colgroup>
      <tr>
        <th>Nom</th>
        <th>Sexe</th>
        <th>Age</th>
      </tr>
      <tr>
        <td>Marie Legrand</td>
        <td>féminine</td>
        <td>19</td>
      </tr>
      <tr>
        <td>Pierre Richel</td>
        <td>masculin</td>
        <td>23</td>
      </tr>
    </table>
  </body>
</html>

Essayez-vous-même!

Résultat

Attributs

Attribut	Valeur	Description
align		Définit l'alignement du contenu de la colonne. Non supporté en HTML5.
	left	Aligne à gauche.
	right	Aligne à droit.
	center	Aligne au centre.
	justify	Aligne sur les bords droit et gauche.
	char	Aligne un symbole spécial avec un décalage minimum, défini par les attributs char et charoff.
char	character	Aligne le contenu de la colonne avec le symbole spécifié. Utilisé uniquement si align = "char". Non supporté en HTML5.
charoff	number	Décale le contenu de la cellule par rapport au caractère spécifié indiqué comme valeur de l'attribut vers la droite (valeurs positives) ou vers la gauche (valeurs négatives). Utilisé uniquement si l'attribut align = "char". Non supporté en HTML5.
span	number	Définit le nombre des colonnes dont les caractéristiques sont définies par l'élément <col>. Le nombre doit être un entier positif. Si le paramètre n'est pas défini, la valeur par défaut est 1.
valign		Aligne le contenu verticalement. Non supporté en HTML5.
	top	Aligne en haut de la ligne.
	bottom	Aligne en bas de la ligne.
	middle	Aligne au milieu.
	baseline	Aligne la ligne de base.
width	% pixels relative_length	Définit la largeur de la colonne. Non supporté en HTML5.