Les bases du HTML

Les tableaux

table, tr th, td, thead, tbody et tfoot

Les balises <talbe><tr><th><td><thead><tbody><tfoot> sont les balises élémentaires pour créer un tableau. Chacune a son utilité :

  • <talbe>...</talbe> initie un tableau
  • <tr>...</tr> crée une nouvelle ligne
  • <td>...</td> crée une case sur la ligne
  • <th>...</th> crée une case de type titre sur la ligne
  • <thead>...</thead> détermine une zone abstraite définissant l'entête du tableau
  • <tbody>...</tbody> détermine une zone abstraite définissant le corps du tableau
  • <tfoot>...</tfoot> détermine une zone abstraite définissant le pied du tableau

Exemple d'utilisation

Exemple de code de tableau :

<table>
	<thead>
		<tr>
			<th>Entête 1</th>
			<th>Entête 2</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Case 1, Ligne 1</td>
			<td>Case 2, Ligne 1</td>
		</tr>
		<tr>
			<td>Case 1, Ligne 2</td>
			<td>Case 2, Ligne 2</td>
		</tr>
	</tbody>
	<tfoot>
		<tr>
			<td>Case 1, Ligne 3</td>
			<td>Case 2, Ligne 3</td>
		</tr>
	</tfoot>
</table>
Résultat :
Entête 1 Entête 2
Case 1, Ligne 1 Case 2, Ligne 1
Case 1, Ligne 2 Case 2, Ligne 2
Case 1, Ligne 3 Case 2, Ligne 3

Il est également possible de fusionner des cases avec les attributs colspan="" et rowspan="".
Exemple de code de tableau de cases fusionnées :

 <table>
	<tr>
		<th>Entête 1</th>
		<th>Entête 2</th>
	</tr>
	<tr>
		<td colspan="2">Texte colspan</td>
	</tr>
	<tr>
		<td rowspan="2">Text rowspane</td>
		<td>Texte</td>
	</tr>
	<tr>
		<td>Texte</td>
	</tr>
</table>
Résultat :
Entête 1 Entête 2
Texte cospan
Texte rowspan Texte
Texte

Page 5 - Les balises "INLINE" Page 7 - Les formulaires