Pseudoelement after

Pseudoelement after vstavi besedilo za elementom. Uporablja se samo skupaj z lastnostjo content, ki določa besedilo, ki ga je treba vstaviti.

Sintaksa

izbirnik::after {
	content: 'besedilo';
}

Primer

Naredimo tako, da se ob preletu miške nad li na njegov konec vstavi besedilo:

<ul>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
</ul>

li:hover::after {
	content: '!!!';
}

Primer

K vstavljenemu besedilu lahko uporabimo različne stile. Pobarvajmo na primer to besedilo v kakšno barvo:

<ul>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
	<li>seznamski element</li>
</ul>

li:hover::after {
	color: red;
	content: '!!!';
}

Glejte tudi

pseudoelement before,
ki naredi vstavljanje pred besedilom oznake
funkcijo attr,
ki pridobi vrednost atributa oznake
lastnost counter-increment,
ki določa samodejno oštevilčenje