Défi de sélection

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

Défi

Facile

Vous disposez d'un document HTML avec divers é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 styliser 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 blue et la taille de la police sur 16 pixels.
Ajoutez un attribut class avec 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 ayant la classe "highlight". Définissez la couleur d'arrière-plan sur yellow.
Ajoutez un attribut id avec la valeur "special" à l'élément <ul>.
Écrivez une règle CSS utilisant un sélecteur d'ID qui cible l'élément avec l'ID "special". Définissez la couleur d'arrière-plan sur lightgray et la taille de la 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 red.

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>