A before pszeudoelem
A before pszeudoelem szöveget szúr be
egy elem elé. Csak a content tulajdonsággal
együtt használható, amely megadja a beszúrandó szöveget.
Szintaxis
szelektor::before {
content: 'szöveg';
}
Példa
Tegyük fel, hogy amikor az egér rámutat egy
li elemre, a elejébe szöveg kerüljön:
<ul>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
</ul>
li:hover::before {
content: '!!!';
}
:
Példa
A beszúrt szövegre különböző stílusokat alkalmazhatunk. Például színezzük pirosra ezt a szöveget:
<ul>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
<li>listaelem</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
Lásd még
-
a
afterpszeudoelem,
amely a tag szövege után szúr be -
az
attrfüggvényt,
amely egy tag attribútumának értékét kéri le -
a
counter-incrementtulajdonságot,
amely automatikus számozást határoz meg