Details & Summary - Quiz Marc Labrèche

Pour cet exercice, vous devrez recréer un mini quiz portant Marc Labrèche à l’aide des balises details et summary.

Aperçu du résultat 👇

Matériel

Couleurs 🎨

#6b9080 #cce3de

Médias

Simpsons Donatello Requis Créez-vous un pen sur codePen. Attribuez la couleur de fond vert foncé à la page. Faites en sorte que le quiz soit blanc ⚪️, qu'il prenne toute la largeur de la page jusqu'à concurrence de 650px, que ses coins soient arrondis de 10px, qu'il soit centré horizontalement ↔️ et affichez-le à 50px du haut de la page. Tous les textes du quiz doivent avoir une taille de 20px à l'exception du titre qui doit être contenu dans une balise h1 et avoir la taille automatique que le navigateur lui attribue. Questions Affichez les 5 questions suivantes, attribuez leur la couleur de fond vert pâle et une marge intérieure de 10px verticalement et 20px horizontalement ↔️.
    • Quels personnages des Simpsons sont doublés par Marc Labrèche?
    • Quel est le nom du personnage de Marc Labrèche dans la série les Bobos?
    • Quelle tortue ninja était doublé par Marc Labrèche?
    • Pour quelle barre chocolatée Marc Labrèche a-t-il déjà fait une publicité?
    • Combien de personnages Marc Labrèche joue-t-il dans le cœur a ses raisons?
Réponses Chaque texte de réponse doit-être centré et affiché dans un paragraphe alors que les images et iFrames doivent prendre toute la largeur disponible.
    • Image des Simpsons
    • Étienne Maxou
    • Image de Donatello
    • iFrame d'une publicité de Caramilk importée en format 16/9.
    • 4
Notes de cours 📚