Le pseudo-élément `::before` en CSS est utilisé pour insérer du contenu avant le contenu d’un élément sélectionné. Il est généralement utilisé avec la propriété `content`.
Voici comment vous pouvez l’utiliser:
```
p::before {
content: “Lire avant: “;
}
```
Dans l’exemple ci-dessus, tous les paragraphes `
` auront le texte “Lire avant: “ inséré avant le reste de leur contenu.
Le contenu inséré est inséré comme le premier enfant de l’élément cible. Il peut correspondre à du texte, une image, un compteur ou n’importe quoi d’autre.
Vous pouvez également styliser le contenu inséré avec du CSS. Par exemple:
```
p::before {
content: “Lire avant: “;
color: red;
}
```
Dans cet exemple, le contenu inséré sera en rouge.
Notez que le pseudo-élément `::before` ne fonctionnera pas comme prévu à moins que la propriété `content` ne soit définie. La valeur par défaut pour `content` est` none`, ce qui signifie qu’aucun contenu n’est inséré.
En fin de compte, l’utilisation de `::before` offre un moyen élégant et pratique d’ajouter et de styliser du contenu dans votre page Web directement à partir de votre feuille de style CSS, sans avoir à ajouter manuellement du nouveau contenu HTML.
