Pseudo element before
Pseudo element before elementden öň
tekst goýýar. Diňe content
ýöritegligi bilen bilelikde ulanylýar,
bu bolsa goýulmaly teksti kesgitleýär.
Sintaksis
selektor::before {
content: 'tekst';
}
Mysal
Geliň, li elementine gelinende
ona başlangyçda şu tekst goýulsyn:
<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: '!!!';
}
:
Mysal
Goýulýan teksti dürli stil bilen bezäp bolýar. Mysal üçin, bu teksti bir reňge boýalyň:
<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: '!!!';
}
:
Şeýle-de görmeli
-
pseudo element
after,
bu tag tekstinden soň goýuş edýär -
funksiýa
attr,
bu tag atributynyň bahasyny alýar -
ýöriteglik
counter-increment,
bu awtomatik nomirläniş kesgitleýär