TP 3 : Tableau en HTML5

Problème : on désire créer en html5 un tableau comme présenté ci-dessous :

Solution :
<table>
<caption>Vente des articles</caption>
<tr>
<th>Article</th>
<th>Prix unitaire</th>
<th>quantité</th>
<th>Prix Total</th>
</tr>
<tr>
<td>clavier</td>
<td>8500</td>
<td>20</td>
<td>170000</td>
</tr>
<tr>
<td>souris</td>
<td>10000</td>
<td>10</td>
<td>100000</td>
</tr>
<tr>
<td>Flash disque</td>
<td>20000</td>
<td>10</td>
<td>200000</td>
</tr>
<tr>
<td colspan="3">Total </td>
<td>470000</td>
</tr>
</table>
En résumé
 Un tableau s'insère avec la balise <table> et se définit ligne par ligne avec <tr>.
 Chaque ligne comporte des cellules <td> (cellules normales) ou <th> (cellules d'en-tête).
 Le titre du tableau se définit avec <caption>.
 On peut fusionner des cellules horizontalement avec l'attribut colspan ou verticalement
avec rowspan. Il faut indiquer combien de cellules doivent être fusionnées.