Aller au contenu

Attribut colspan HTML

L'attribut HTML colspan spécifie sur combien de colonnes une cellule de tableau doit s'étendre. La valeur doit être un entier positif. Cet attribut permet à une seule cellule de tableau de s'étendre sur la largeur de plusieurs colonnes ou cellules. Il possède la même fonctionnalité que « fusionner les cellules » dans Excel.

Vous pouvez utiliser l'attribut colspan sur les <td> et <th> éléments.

Lorsque l'attribut colspan est utilisé sur la balise <td>, il détermine le nombre de cellules standard sur lesquelles il doit s'étendre. Lorsqu'il est utilisé sur la balise <th>, l'attribut colspan spécifie le nombre de cellules d'en-tête sur lesquelles il doit s'étendre.

Syntaxe

Syntaxe de l'attribut colspan HTML

html
<tag colspan="value">&lt;/tag&gt;

Exemple de l'attribut colspan HTML utilisé sur l'élément <td> :

Exemple de l'attribut colspan HTML utilisé sur l'élément <td>

html
<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <table border="1">
      <tr>
        <th>Month</th>
        <th>Salary</th>
      </tr>
      <tr>
        <td>March</td>
        <td>$100</td>
      </tr>
      <tr>
        <td>April</td>
        <td>$150</td>
      </tr>
      <tr>
        <td colspan="2">Total: $250</td>
      </tr>
    </table>
  </body>
</html>

Exemple de l'attribut colspan HTML utilisé sur l'élément <th> :

Exemple de l'attribut colspan HTML utilisé sur l'élément <th>

html
<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <table border="1">
      <tr>
        <th colspan="2">Month and Date</th>
      </tr>
      <tr>
        <td>January</td>
        <td>15</td>
      </tr>
      <tr>
        <td>February</td>
        <td>23</td>
      </tr>
    </table>
  </body>
</html>

Pratique

Quel est le principal objectif de l'attribut colspan HTML ?

Trouvez-vous cela utile?

Aperçu dual-run — comparez avec les routes Symfony en production.