integer

aria-colspan

Définit le nombre de colonnes que couvre une cellule dans un tableau ou une grille.

Description

aria-colspan indique combien de colonnes une cellule occupe dans un tableau ou une grille. Il s’utilise sur les widgets personnalisés (role="gridcell", role="columnheader") quand l’attribut HTML colspan natif n’est pas disponible.

Syntaxe

<div role="row">
  <div role="columnheader" aria-colspan="3">Trimestre 1</div>
</div>
<div role="row">
  <div role="gridcell">Janvier</div>
  <div role="gridcell">Février</div>
  <div role="gridcell">Mars</div>
</div>

Exemples

En-tête de groupe de colonnes :

<div role="grid" aria-label="Résultats trimestriels">
  <div role="rowgroup">
    <div role="row">
      <div role="columnheader" aria-colspan="3" aria-colindex="1">T1 2024</div>
      <div role="columnheader" aria-colspan="3" aria-colindex="4">T2 2024</div>
    </div>
    <div role="row">
      <div role="columnheader" aria-colindex="1">Jan</div>
      <div role="columnheader" aria-colindex="2">Fév</div>
      <div role="columnheader" aria-colindex="3">Mar</div>
      <div role="columnheader" aria-colindex="4">Avr</div>
      <div role="columnheader" aria-colindex="5">Mai</div>
      <div role="columnheader" aria-colindex="6">Juin</div>
    </div>
  </div>
</div>

Notes

Préférer colspan HTML : pour les tableaux natifs <table>, l’attribut HTML colspan est toujours préférable — il gère nativement la fusion et est mieux supporté.

Valeur minimale : 1. aria-colspan="1" est la valeur par défaut (pas de fusion).

Support navigateurs