« Le langage HTML/Tableaux » : différence entre les versions
Contenu supprimé Contenu ajouté
m →Attributs de la balise <code>table</code> : découpage en sous-sections |
Accessibilité aux malvoyants |
||
Ligne 153 :
== Fusionner des cellules ==
Il est possible de fusionner des cellules entre elles en utilisant des attributs de la balise <code>td</code>.
Ligne 226 ⟶ 227 :
</tr>
</table>
== Accessibilité aux malvoyants ==
Nous avons déjà vu [[#Attribut d'accessibilité|ci-dessus]] comment mettre une description de la table à l'attention des malvoyants.
L'autre problème est celui de la lecture de la table. En effet, La table est lue linéairement, ligne par ligne et colonne par colonne. Ainsi, il est difficile de faire le lien entre le contenu d'une cellule et les en-têtes qui s'y rattachent (nom de la ligne et de la colonne).
Pour contourner ce problème, on met un identifiant à chaque en-tête avec l'attribut <code>id</code>, et pour chaque cellule on indique l'identifiant des en-têtes qui s'y rattachent avec l'attribut <code>headers</code>.
; Exemple
<table
border="1"
summary="La table indique, pour chaque mois de l'année,
la longueur de ce mois
en jours et en heures"
>
<caption> Longueur des mois </caption>
<tr>
<td> </td>
<th id="col2"> Janvier </th>
<th id="col3"> Février </th>
<th id="col4"> Mars </th>
</tr>
<tr>
<th> Durée en jours </th>
<td headers="col1"> 31 </td>
<th headers="col3"> 28 ou 29 </td>
<th headers="col4"> 31 </td>
</tr>
<tr>
<th> Durée en heurrs </th>
<td headers="col1"> 744 </td>
<td headers="col3"> 672 ou 696 </td>
<td headers="col4"> 744 </td>
</tr>
</table>
| |||