Manuel de pseudo-éléments CSS

Pseudo-éléments CSS

Les pseudo-éléments CSS sont utilisés pour définir le style de parties spécifiques des éléments.

Par exemple, il peut être utilisé pour :

  • Définit le style de la première lettre ou de la première ligne de l'élément.
  • Insère du contenu avant ou après le contenu de l'élément.
  • Définit le style du marqueur de l'élément de liste.
  • Définit le style de la vue de fond de la boîte de dialogue.

Le tableau suivant montre les différents pseudo-éléments dans CSS :

Pseudo-élément Exemple Description de l'exemple
::after p::after Insère du contenu après le contenu de l'élément spécifié.
::backdrop dialog::backdrop Définit le style de la vue de fond de la boîte de dialogue ou de l'élément contextuel.
::before p::before Insère du contenu avant le contenu de l'élément spécifié.
::file-selector-button ::file-selector-button Sélectionne le bouton pour le sélecteur de fichier de type <input type="file">.
::first-letter p::first-letter Sélectionne la première lettre de chaque élément <p>.
::first-line p::first-line Sélectionne la première ligne de chaque élément <p>.
::grammar-error ::grammar-error Définit le style de texte pour le texte marqué comme grammatical par le navigateur.
::highlight() ::highlight(custom-name) Sélectionne le surhighlight personnalisé.
::marker ::marker Marqueur de l'élément de liste sélectionné.
::placeholder input::placeholder Définit le style du texte de placeholder pour les éléments <input> ou <textarea>.
::selection ::selection Définit le style du texte sélectionné par l'utilisateur.
::spelling-error ::spelling-error Définit le style de texte pour le texte marqué comme orthographique par le navigateur.
::view-transition ::view-transition Représente la racine de la superposition de transition de vue, contenant toutes les transitions de vue sur la page.
::view-transition-group ::view-transition-group Représente un ensemble de captures d'écran de transition de vue individuelle.
::view-transition-image-pair ::view-transition-image-pair Conteneur de l'état 'ancien' et 'nouveau' de la transition de vue (avant et après la transition).
::view-transition-new ::view-transition-new État de vue 'nouveau' représentant la transition de vue.
::view-transition-old ::view-transition-old État de vue 'ancien' représentant la transition de vue.