Accueil    CSS    Liste des sélecteurs
 



style css liste des sélecteurs  Style CSS : liste des sélecteurs

Index des styles


Les sélecteurs sont des symboles utilisés au niveau des feuilles de style pour définir des règles d'application des classes aux différents éléments html en s'appuyant sur des critères tels que la hiérarchie des éléments, ou la présence d'attributs.


Liste des sélecteurs utilisés avec la version CSS 2.1 :




sélecteur * Sélection de tous les éléments du document
Exemple :
* {color : red;}
Tous les textes de la page dont la couleur n'est pas déjà définie seront affichés en rouge.
sélecteur > Sélection d'un élément qui est un descendant direct du premier élément
Exemple :
div > label {color : red;}
Tous les textes des éléments <label> ayant pour parent direct un élément <div> seront affichés en rouge.
sélecteur + Sélection d'un élément qui suit directement le premier élément (au même niveau hiérarchique)
Exemple :
label + input {border : solid 1px red;}
Tous les éléments de type <input> déclarés à la suite d'un élément <label> auront leur bordure rouge.
sélecteur [attribut] Sélection d'un élément ayant un attribut spécifique ou attribut initialisé à une valeur spécifique
Exemples :
p[name] {color : red;}
Les paragraphes ayant un attribut "name" seront affichés en rouge.
p[name=monparagraphe] {font-weight : bold;}
Les paragraphes ayant un attribut "name" valorisé à "monparagraphe" seront affichés en gras.
classes multiples Sélection de plusieurs classes associées à un élément
Exemple :
p.couleur {color : red;}
p.epaisseur {font-weight : bold;}
Les paragraphes ayant l'attribut class="couleur epaisseur" seront affichés en rouge et gras.


Afficher la page d'exemple des sélecteurs