Comment définir la largeur des colonnes d'un tableau à l'aide de CSS ?

Définition de la largeur des colonnes du tableau

Les tableaux sont couramment utilisés pour présenter des données tabulaires, mais l'ajustement de la largeur des colonnes peut être essentiel pour garantir la lisibilité et bon alignement. Dans cet article, nous allons explorer comment définir la largeur des colonnes d'un tableau à l'aide de CSS.

Méthode utilisant la propriété CSS width

La largeur d'une colonne de tableau peut être défini à l’aide de la propriété width de l’élément col. La valeur de la largeur peut être spécifiée en pixels (par exemple, largeur : 200 px ;) ou en pourcentage de la largeur de l'élément parent (par exemple, largeur : 50 % ;).

Exemple avec l'attribut de style en ligne :

Cet exemple utilise des attributs de style en ligne dans un élément col pour définir les largeurs de trois colonnes :

<code class="html"><table style="width: 100%;">
    <colgroup>
        <col span="1" style="width: 15%;">
        <col span="1" style="width: 70%;">
        <col span="1" style="width: 15%;">
    </colgroup>

    <!--- ... remaining table elements ---->
</table></code>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!