|
• |
Les pseudo-éléments :after et :before |
• |
|
Les pseudo-éléments :after et :before permettent de générer un contenu avant(:before) et après(:after) un élément, grâce à la propriété CSS content.
Liste des valeurs possibles de la propriété CSS "content"
| Valeur | Description |
|---|
| "texte" | Un texte entre guillemets |
| url:("image.png") | Une image |
| open-quote | Ouvre un quillemet |
| close-quote | Ferme un guillemet |
| no-open-quote | N'ouvre pas un guillemet |
| no-close-quote | Ne ferme pas un guillemet |
| inherit | Héritage |
Exemple : mettre une image avant et après chaque lien
HTML
|
|
|
|
<a href="#">Cliquez ici</p> |
|
|
|
|
|
=> |
|
CSS
|
|
|
|
a:before
{
content : url("fleche-b.png");
vertical-align : middle;
}
a:after
{
content : url("fleche-a.png");
vertical-align : middle;
}
|
|
|
|
|
|
=> |
