after կեղծ տարրը
after կեղծ տարրը տեքստ է ավելացնում
տարրից հետո: Օգտագործվում է բացառապես
content հատկության հետ միասին,
որը սահմանում է ավելացվող տեքստը:
Շարահյուսություն
ընտրիչ::after {
content: 'տեքստ';
}
Օրինակ
Եկեք ստեղծենք, որ երբ դրվում է ցուցիչը
li-ի վրա, նրա վերջում ավելանա տեքստ.
<ul>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
</ul>
li:hover::after {
content: '!!!';
}
:
Օրինակ
Ավելացվող տեքստին կարելի է կիրառել տարբեր ուլունքներ: Օրինակ, եկեք ներկենք այս տեքստը ինչ-որ գույնով.
<ul>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
<li>ցանկի տարր</li>
</ul>
li:hover::after {
color: red;
content: '!!!';
}
:
Տես նաև
-
beforeկեղծ տարրը,
որը տեքստ է ավելացնում տարրի տեքստից առաջ -
attrֆունկցիան,
որը ստանում է տարրի ատրիբուտի արժեքը -
counter-incrementհատկությունը,
որը սահմանում է ավտոմատ համարակալում
