Академический Документы
Профессиональный Документы
Культура Документы
Correction Chapitre 6
</tr>
<tr>
<td>Colonne 1</td>
<td>Colonne 2</td>
<td>Colonne 3</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
</table>
</body>
</html>
Afin de mieux y voir, donnons ce tableau une bordure visible et une largeur fixe :
<table border="1px" width=="300px">
Maintenant, il nous faut fusionner 2 cellules de la dernire ligne. Pour cela, remplaons le dernier bloc :
<tr>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
par :
<tr>
<td>Cellule</td>
<td colspan="2">Cellule</td>
</tr>
On supprime la dernire cellule dclare, et on ajoute la proprit colspan la cellule prcdente.
Enfin, peaufinons le rsultat : dans l'nonc, le texte des cellules est centr. Ajoutons donc une proprit de style dans la section <head> :
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style>
td {text-align : center;}
</style>
</head>
Voil, nous avons notre rsultat attendu ! Le code final est le suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<style>
td {text-align : center;}
</style>
<body>
<table border="1px" width="300px">
<tr>
<th>Colonne 1</th>
<th>Colonne 2</th>
<th>Colonne 3</th>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
<td>Cellule</td>
<td colspan="2">Cellule</td>
</tr>
</table>
</body>
</html>
<td>Colonne 1</td>
<td>Colonne 2</td>
<td>Colonne 3</td>
</tr>
<tr>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
</tr>
</table>
</body>
</html>
<td>Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
Afin de mieux y voir, donnons ce tableau une bordure visible et une largeur fixe :
<table border="1px" width=="300px">
Maintenant, il nous faut fusionner la premire cellule de la 2me ligne avec les deux premires cellules des lignes suivantes. Pour cela, il faut ajouter la proprit
rowspan="3" (fusion sur 3 lignes) cette cellule, et supprimer la premire cellule des lignes suivantes :
<table border="1px" width="300px">
<tr>
<th>Colonne 1</th>
<th>Colonne 2</th>
<th>Colonne 3</th>
</tr>
<tr>
<td rowspan="3">Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
</tr>
</table>
A ce stade, il ne reste plus qu' fusionner les 2 dernires cellules de la dernire ligne. Cela se fait en appliquant la proprit colspan="2" (fusion sur 2 colonnes) la
premire de ces 2 cellules et en supprimant la seconde cellule.
On remplace :
<tr>
<td>Cellule</td>
<td>Cellule</td>
</tr>
par :
<tr>
<td colspan="2">Cellule</td>
</tr>
Enfin, peaufinons le rsultat : dans l'nonc, le texte des cellules est centr. Ajoutons donc une proprit de style dans la section <head> :
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style>
td {text-align : center;}
</style>
</head>
Voil, nous avons notre rsultat attendu ! Le code final est le suivant :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style>
td {text-align : center;}
</style>
</head>
<body>
<table border="1px" width="300px">
<tr>
<th>Colonne 1</th>
<th>Colonne 2</th>
<th>Colonne 3</th>
</tr>
<tr>
<td rowspan="3">Cellule</td>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
<td>Cellule</td>
<td>Cellule</td>
</tr>
<tr>
</tr>
</table>
</body>
</html>
<td colspan="2">Cellule</td>