Pseudo element before
Pseudo element before ubacuje tekst
pre elementa. Koristi se samo zajedno
sa svojstvom content,
koje zadaje tekst koji treba umetnuti.
Sintaksa
selektor::before {
content: 'tekst';
}
Primer
Hajde da napravimo da se pri prelasku mišem preko
li na početak umetne tekst:
<ul>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
</ul>
li:hover::before {
content: '!!!';
}
:
Primer
Na umetnuti tekst mogu se primeniti različiti stilovi. Obojimo, na primer, ovaj tekst u neku boju:
<ul>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
<li>stavka liste</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
Pogledajte takođe
-
pseudo element
after,
koji vrši umetanje nakon teksta taga -
funkciju
attr,
koja dobija vrednost atributa taga -
svojstvo
counter-increment,
koje zadaje automatsko numerisanje
