Pseudoelement after
Die pseudoelement after voeg teks in
na die element. Dit word slegs saam met
die eienskap content gebruik,
wat die teks spesifiseer wat ingevoeg moet word.
Sintaksis
selektor::after {
content: 'teks';
}
Voorbeeld
Kom ons maak dit so dat wanneer ons oor 'n
li beweeg, teks aan die einde daarvan ingevoeg word:
<ul>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
</ul>
li:hover::after {
content: '!!!';
}
:
Voorbeeld
Verskillende style kan op die ingevoegde teks toegepas word. Laat ons byvoorbeeld hierdie teks in 'n kleur inkleur:
<ul>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
<li>lys item</li>
</ul>
li:hover::after {
color: red;
content: '!!!';
}
:
Sien ook
-
die pseudoelement
before,
wat invoeging voor die teks van die tag doen -
die funksie
attr,
wat die waarde van 'n tag kenmerk verkry -
die eienskap
counter-increment,
wat outomatiese nommering spesifiseer
