// Les tableaux

Les tableaux ont longtemps été utilisés pour mettre en forme les pages web. Les designers s'en servaient sans respecter réellement le sens des tableaux : ils servent à contenir des données tabulaires, et c'est tout.

Aujourd'hui, il existe une méthode de mise en forme beaucoup plus poussée, et qui à été conçue dans ce but : les css, que nous étudirons dès le chapitre suivant. Les tableaux ne sont donc plus à utiliser n'importe comment.

Dans le but d'éviter de s'embrouiller avec des balises qui ne sont plus réellement utiles, seules les balises les plus simples seront évoquées.

La balise fondamentale est la balise <table>. Elle est bien évidement de type bloc.
La balise suivante est la balise <tr> </tr>, cette dernière encadre une ligne du tableau.
La troisième est la balise <td> </td>, elle correspond à une cellule.
On peut en ajouter une quatirème : <th> </th> qui correspond à une cellule d'entête de tableau.

 1  <table>
 2    <tr>
 3      <th>
 4        Colone 1 :
 5      </th>
 6      <th>
 7        Colone 2 :
 8      </th>
 9    </tr>
10      <td>
11        ligne 1, cellule 1.
12      </td>
13      <td>
14         ligne 1, cellule 2.
15      </td>
16    </tr>
17      <td>
18        ligne 2, cellule 1.
19      </td>
20      <td>
21        ligne 2, cellule 2.
22      </td>
23    </tr>
24  </table>

le résultat sera :

Il peut arriver que le nombre de cellules de chaque ligne soit différent. En imaginant que la première ligne ait 3 cellules, et la seconde seulement 2, la deuxième cellule de la deuxième ligne s'arretera au même endroit que la seconde cellule de la première ligne.
nous utiliserons alors l'attribut colspan que nous mettrons à la valeur 2, puisque notre cellule de la deuxième ligne doit s'étendre sur les deux dernières cases du dessus.
Remarque : la ligne prise en compte est toujours la ligne qui contient le plus de cellules.

 1  <table>
 2  <caption>Titre de ce tableau (caption)</caption>
 3    <tr>
 4      <td>
 5        ligne 1, cellule 1.
 6      </td>
 7      <td>
 8         ligne 1, cellule 2.
 9      </td>
10      <td>
11        ligne 1, cellule 3.
12      </td>
13      <td>
14        ligne 1, cellule 4.
15      </td>
16    </tr>
17      <td>
18        ligne 2, cellule 1.
19      </td>
20      <td colspan="3">
21         ligne 2, cellule 2.
22      </td>
23    </tr>
24    </tr>
25      <td>
26        ligne 2, cellule 1.
27      </td>
28      <td colspan="2">
29        ligne 2, cellule 2.
30      </td>
31      <td>
32        ligne 2, cellule 3.
33      </td>
34    </tr>
35  </table>

le résultat sera :

N'hésitez pas à poser vos questions sur le forum