Pseudo-element before
Pseudo-elementet before setter inn tekst
før et element. Brukes kun sammen
med egenskapen content,
som angir teksten som skal settes inn.
Syntaks
velger::before {
content: 'tekst';
}
Eksempel
La oss gjøre slik at når man holder musepekeren over
li, settes det inn tekst i begynnelsen:
<ul>
<li>list element</li>
<li>list element</li>
<li>list element</li>
<li>list element</li>
<li>list element</li>
</ul>
li:hover::before {
content: '!!!';
}
:
Eksempel
Man kan bruke ulike stiler på den innsatte teksten. La oss for eksempel farge denne teksten i en eller annen farge:
<ul>
<li>list element</li>
<li>list element</li>
<li>list element</li>
<li>list element</li>
<li>list element</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
Se også
-
pseudo-elementet
after,
som setter inn tekst etter elementets innhold -
funksjonen
attr,
som henter verdien til et elements attributt -
egenskapen
counter-increment,
som angir automatisk nummerering
