Pseudo element after
after pseudo elementi, öğeden sonra metin
ekler. Sadece, eklenecek metni belirleyen
content özelliği ile
birlikte kullanılır.
Sözdizimi
seçici::after {
content: 'metin';
}
Örnek
li üzerine gelindiğinde sonuna metin
eklenmesini sağlayalım:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
li:hover::after {
content: '!!!';
}
:
Örnek
Eklenen metne çeşitli stiller uygulanabilir. Örneğin, bu metni bir renge boyayalım:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>
li:hover::after {
color: red;
content: '!!!';
}
:
Ayrıca bakınız
-
metin etiketinden önce ekleme yapan
beforepseudo elementi -
etiket özniteliğinin değerini alan
attrişlevi -
otomatik numaralandırma sağlayan
counter-incrementözelliği
