Scribd
Importer
8 vues3 pages

Exercice HTML : Tableau Étudiants CSS

Le document présente un exercice de développement web en CSS, demandant la création d'un tableau d'étudiants avec des spécifications précises. Il inclut des instructions pour la structure HTML du tableau ainsi que des consignes pour un fichier CSS associé. Les exigences comprennent la fusion de cellules et le style visuel du tableau.

Transféré par

aahmedbenayoub
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
8 vues3 pages

Exercice HTML : Tableau Étudiants CSS

Le document présente un exercice de développement web en CSS, demandant la création d'un tableau d'étudiants avec des spécifications précises. Il inclut des instructions pour la structure HTML du tableau ainsi que des consignes pour un fichier CSS associé. Les exigences comprennent la fusion de cellules et le style visuel du tableau.

Transféré par

aahmedbenayoub
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Centre Ulysse de formation TP 3 Informatique avancée

professionnelle et touristique Enseignante: Karima ziri


2025-2026 Développement web
CSS

Exercice : Tableau des etudiants


Partie 1 :
Créer un tableau qui respecte les conditions suivantes :
➢ Le tableau doit contenir 6 colonnes et 10 lignes
➢ La 1ère ligne contient un titre qui occupe toute la largeur du tableau
➢ La 2ème ligne contient les titres suivants :
ID | Nom | Prénom | Filière | Niveau | Moyenne
➢ La filière Informatique est fusionnée sur 3 lignes
➢ La filière Gestion est fusionnée sur 2 lignes
➢ La dernière ligne contient :
Moyenne générale fusionnée sur 5 colonnes
Code HTML à compléter
<!DOCTYPE html> </tr>
<html lang="fr"> <!-- Ligne 3 : Étudiant 1 (Informatique) -->
<head> <tr>
<meta charset="UTF-8"> <td>1</td>
<title>TP Tableau Étudiants</title> <td>Ben Ali</td>
<link rel="stylesheet" href="[Link]"> <td>Ahmed</td>
</head> <!-- À compléter : Filière Informatique
(rowspan 3) -->
<body>
<td>L1</td>
<h2>Liste des étudiants</h2>
<td>14</td>
<table>
</tr>
<!-- Ligne 1 : Titre du tableau -->
<!-- Ligne 4 : Étudiant 2 -->
<tr>
<tr>
<!-- À compléter : titre sur 6 colonnes -->
<td>2</td>
</tr>
<td>Trabelsi</td>
<!-- Ligne 2 : En-têtes -->
<td>Ines</td>
<tr>
<!-- Filière déjà fusionnée -->
<!-- Compléter les 6 en-têtes -->
<td>L1</td> <td>14</td>
<td>15</td> </tr>
</tr>
<!-- Ligne 5 : Étudiant 3 --> <!-- Ligne 8 : Étudiant 6 -->
<tr> <tr>
<td>3</td> <td>6</td>
<td>Gharbi</td> <td>Khelifi</td>
<td>Sami</td> <td>Rim</td>
<!-- Filière déjà fusionnée --> <td>Marketing</td>
<td>L1</td> <td>L3</td>
<td>13</td> <td>16</td>
</tr> </tr>
<!-- Ligne 6 : Étudiant 4 (Gestion) --> <!-- Ligne 9 : Étudiant 7 -->
<tr> <tr>
<td>4</td> <td>7</td>
<td>Haddad</td> <td>Saidi</td>
<td>Amal</td> <td>Youssef</td>
<!-- À compléter : Filière Gestion <td>Marketing</td>
(rowspan 2) -->
<td>L3</td>
<td>L2</td>
<td>15</td>
<td>12</td>
</tr>
</tr>
<!-- Ligne 10 : Moyenne générale -->
<!-- Ligne 7 : Étudiant 5 -->
<tr>
<tr>
<!-- À compléter : colspan 5 -->
<td>5</td>
<td>14.1</td>
<td>Mejri</td>
</tr>
<td>Omar</td>
</table>
<!-- Filière déjà fusionnée -->
</body>
<td>L2</td>
</html>

Partie 2 :
Créer un fichier [Link] qui respecte les consignes suivantes :
➢ Centre le tableau
➢ Ajoute des bordures
➢ Fusionne les bordures
➢ Centre le texte
➢ Ajoute un padding
➢ Ajoute une couleur au titre et aux en-têtes
➢ Change la police

Vous aimerez peut-être aussi