Défi de sélection

Fait partie de la section Style avec CSS du Journey HTML de Coddy. Leçon 16 sur 76.

Défi

Facile

Vous disposez d’un document HTML contenant différents éléments, notamment des titres (<h1>, <h2>), des paragraphes (<p>), une division (<div>) et une liste non ordonnée (<ul>) avec des éléments de liste (<li>). Votre tâche consiste à utiliser différents types de sélecteurs pour appliquer un style à ces éléments. Suivez les étapes ci-dessous :

Écrivez une règle CSS utilisant un sélecteur de type qui cible tous les éléments <p>. Définissez la couleur du texte sur le bleu et la taille de police sur 16 pixels.
Ajoutez un attribut class ayant la valeur "highlight" à l’élément <h2> et à l’élément <div>.
Écrivez une règle CSS utilisant un sélecteur de classe qui cible tous les éléments possédant la classe "highlight". Définissez la couleur d’arrière-plan sur le jaune.
Ajoutez un attribut id ayant la valeur "special" à l’élément <ul>.
Écrivez une règle CSS utilisant un sélecteur d’ID qui cible l’élément possédant l’ID "special". Définissez la couleur d’arrière-plan sur lightgray et la taille de police sur 20 pixels.
Écrivez une règle CSS utilisant un sélecteur de groupe qui cible tous les éléments <h1> et <li>. Définissez la couleur du texte sur le rouge.

Essayez vous-même

<html>
<head>
    <title>Selection Challenge</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a main heading</h1>
    <h2>This is a subheading</h2>
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <div>This is a division.</div>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</body>
</html>