Psevdoelement before

Psevdoelement before vstavi besedilo pred elementom. Uporablja se samo skupaj z lastnostjo content, ki določa besedilo, ki ga je treba vstaviti.

Sintaksa

selektor::before {
	content: 'besedilo';
}

Primer

Naredimo tako, da se ob prikazovanju miške na li na začetek vstavi besedilo:

<ul>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
</ul>

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

Primer

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

<ul>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
	<li>seznamska postavka</li>
</ul>

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

Glejte tudi

psevdoelement after,
ki naredi vstavljanje za besedilom oznake
funkcijo attr,
ki pridobi vrednost atributa oznake
lastnost counter-increment,
ki določa samodejno oštevilčenje