élément pseudo CSS ::after

définition et utilisation

CSS ::after Les pseudo-éléments sont utilisés pour insérer du contenu après le contenu d'un élément spécifié.

utilisez content l'attribut spécifie le contenu à insérer. La valeur de content peut être :

• chaîne de caractères : content: "Hello world!";
• image : content: url(myimage.jpg);
• sans contenu : content: none;
• compteur : content: counter(li);
• guillemets : content: close-quote;
• valeur de l'attribut : content: " (" attr(href) ")";

astuce :Veuillez noter que le contenu inséré reste à l'intérieur de l'élément spécifié. Le contenu inséré est ajouté après d'autres contenus internes de l'élément.

utilisez ::before Insérez du contenu avant le contenu d'un élément spécifique.

exemple

Exemple 1

Insérez une chaîne de caractères après le contenu de chaque élément <p> :

p::after {
  content: " - N'oubliez pas cela";
}

essayez-le vous-même

Exemple 2

Insérez une chaîne de caractères après le contenu de chaque élément <p> et définissez le style du contenu inséré :

p::after {
  content: " - N'oubliez pas cela";
  background-color: yellow;
  color: red;
  font-weight: bold;
}

essayez-le vous-même

grammaire CSS

::after {
  déclarations css;
}

détails techniques

prise en charge du navigateur

Les nombres dans le tableau des navigateurs indiquent la version initiale du navigateur qui prend en charge pleinement cet élément pseudo.

pages associées

tutoriel :élément pseudo-CSS

référence :élément pseudo CSS ::before