Sélecteur universel

Fait partie de la section Styling with CSS du Journey HTML de Coddy — leçon 15 sur 76.

Le sélecteur universel est un sélecteur puissant en CSS qui cible chaque élément HTML d'une page. Il est représenté par un astérisque (*).

Lorsqu'il est utilisé, le sélecteur universel applique les styles spécifiés à tous les éléments, quel que soit leur type, leur classe ou leur identifiant (ID). Cela peut être utile pour définir des styles globaux ou pour réinitialiser les styles par défaut dans l'ensemble du document.

Voici la syntaxe de base pour utiliser le sélecteur universel :

* {
    property: value;
}

Par exemple, supposons que vous souhaitiez définir la couleur de texte et la taille de police par défaut pour tous les éléments d'une page. Vous pouvez utiliser le sélecteur universel comme ceci :

* {
    color: black;
    font-size: 14px;
}

Défi

Facile

On vous donne un document HTML avec divers éléments, y compris des titres (<h1>, <h2>), des paragraphes (<p>) et une division (<div>). Votre tâche consiste à utiliser le sélecteur universel pour styliser ces éléments. Suivez les étapes ci-dessous :

Écrivez une règle CSS utilisant le sélecteur universel qui définit la couleur du texte de tous les éléments sur darkgray et la taille de la police sur 16 pixels.

Aide-mémoire

Le sélecteur universel cible chaque élément HTML d'une page à l'aide d'un astérisque (*) :

* {
    property: value;
}

Exemple de définition de la couleur du texte et de la taille de la police globales :

* {
    color: black;
    font-size: 14px;
}

Essayez vous-même

<html>
<head>
    <title>Universal Selector</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>
    <div>This is a division.</div>
</body>
</html>