Pseudo-elementet before
Pseudo-elementet before infogar text
före ett element. Används endast tillsammans
med egenskapen content,
som anger texten som ska infogas.
Syntax
selektor::before {
content: 'text';
}
Exempel
Låt oss göra så att när man hovrar över
li infogas text i början:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
li:hover::before {
content: '!!!';
}
:
Exempel
Olika stilar kan appliceras på den infogade texten. Låt oss till exempel färga denna text i någon färg:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
Se även
-
pseudo-elementet
after,
som gör infogning efter taggens text -
funktionen
attr,
som hämtar värdet på taggens attribut -
egenskapen
counter-increment,
som anger automatisk numrering
