Pseudoelement before
Pseudoelement before vkládá text
před element. Používá se pouze společně
se vlastností content,
která určuje text, který má být vložen.
Syntaxe
selektor::before {
content: 'text';
}
Příklad
Pojďme zařídit, aby se při najetí na
li na jeho začátek vložil text:
<ul>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
</ul>
li:hover::before {
content: '!!!';
}
:
Příklad
K vkládanému textu lze aplikovat různé styly. Obarvíme například tento text nějakou barvou:
<ul>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
<li>položka seznamu</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
Viz také
-
pseudoelement
after,
který provádí vložení za text tagu -
funkci
attr,
která získá hodnotu atributu tagu -
vlastnost
counter-increment,
která nastavuje automatické číslování