Devoir de contrôle n°3 (série B) : HTML, CSS et programmes qui fabriquent des pages
Chaque exercice a une partie page web (HTML et CSS, à écrire sur la copie) et une partie programmation (un programme Python qui fabrique du HTML). Barème sur 20 points.
Exercice 1 : la recette de la chakchouka (7 pts)
On veut créer la page « recette.html ».
- le titre de l'onglet est « Chakchouka » ;
- un titre de niveau 1 « Ma recette » et un titre de niveau 2 « Les ingrédients » ;
- une liste à puces de trois ingrédients : tomates, poivrons, œufs ;
- un titre de niveau 2 « Les étapes » suivi d'une liste numérotée de deux étapes : « Couper les légumes » et « Cuire à feu doux » ;
- une image « plat.jpg » avec un texte alternatif, puis un lien « Retour à l'accueil » vers « index.html ».
- 1) Écrire le code HTML de la page (3 pts).
- 2) Écrire le CSS qui met tous les titres de niveau 2 en orange, qui donne à l'image une bordure noire de 2 pixels et qui supprime le soulignement des liens (2 pts).
- 3) Partie programmation : écrire une fonction liste_numerotee(etapes) qui reçoit une liste de textes et retourne le code HTML de la liste numérotée, avec une ligne par étape. Le programme lit n puis n étapes et affiche le code (2 pts).
Pour les deux étapes Couper et Cuire :
<ol>
<li>Couper</li>
<li>Cuire</li>
</ol>
Exercice 2 : l'emploi du temps (7 pts)
On veut afficher l'emploi du temps d'une journée dans un tableau HTML. Chaque ligne a deux cellules : l'heure et la matière.
- 1) Écrire le code HTML d'un tableau avec une ligne d'en-tête (Heure, Matière) et deux lignes : 8h Informatique, 9h Maths (2 pts).
- 2) Écrire le CSS qui donne aux cellules d'en-tête un fond bleu clair, et qui centre le texte de toutes les cellules (1 pt).
- 3) Écrire une fonction ligne(heure, matiere) qui retourne la ligne HTML d'une matière, puis un programme qui lit n puis n couples (heure, matière) et affiche le tableau complet avec son en-tête (4 pts).
Pour un seul cours, 8h et Informatique :
<table>
<tr><th>Heure</th><th>Matière</th></tr>
<tr><td>8h</td><td>Informatique</td></tr>
</table>
Exercice 3 : de la note à la couleur (6 pts)
Une page affiche des notes. Selon la note, la cellule reçoit une classe CSS : « bien » si la note est supérieure ou égale à 14, « moyen » si elle est supérieure ou égale à 10 (et inférieure à 14), « faible » sinon.
- 1) Écrire le CSS des trois classes : bien en vert, moyen en orange, faible en rouge (le texte de la cellule) (1 pt).
- 2) Écrire une fonction classe_note(note) qui retourne le nom de la classe (3 pts).
- 3) Écrire le programme qui lit une note et affiche la cellule HTML correspondante (2 pts).
Pour la note 15 :
<td class="bien">15</td>
Correction détaillée
La correction de ce devoir est réservée aux abonnés. Elle donne l'analyse, l'algorithme en notation tunisienne, le programme Python vérifié et les erreurs fréquentes de chaque exercice. Avec un compte gratuit, tu peux ouvrir 3 corrections de ton choix.
Connecte-toi d'abord : créer un compte ou me connecter.
Tu as encore 0 correction(s) gratuite(s) à utiliser.
Il te faut un abonnement actif pour les autres corrections. Voir les tarifs ou demander un code sur WhatsApp.
Cette correction n'est pas encore publiée. Reviens bientôt.
Impossible de charger la correction. Vérifie ta connexion et réessaie.
Sujet original écrit pour Mission Carthage, deuxième série d'entraînement pour le devoir de contrôle du 3e trimestre.
Tout le programme : 2ème année Technologies de l'informatique (TI)