ပလတ်စတစ် အဲလီမင့် after

ပလတ်စတစ် အဲလီမင့် after သည် အဲလီမင့်တစ်ခု၏ နောက်တွင် စာသားထည့်သွင်းပေးသည်။ ၎င်းကို content ဂုဏ်သတ္တိနှင့်သာ တွဲဖက်၍ အသုံးပြုပြီး၊ ထိုဂုဏ်သတ္တိသည် ထည့်သွင်းရမည့် စာသားကို သတ်မှတ်ပေးသည်။

ဝါကျဖွဲ့ပုံ

selector::after {
	content: 'text';
}

ဥပမာ

ယခု ကျွန်ုပ်တို့ li ပေါ်သို့ mouse ရွှေ့လိုက်သောအခါ ၎င်း၏အဆုံးတွင် အောက်ပါစာသားများ ထည့်သွင်းစေပါမည်။

<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: '!!!';
}

ဥပမာ

ထည့်သွင်းမည့် စာသားများကို စတိုင်အမျိုးမျိုး သတ်မှတ်ပေးနိုင်ပါသည်။ ဥပမာအားဖြင့်၊ ဤစာသားကို အောက်ပါအရောင်တစ်မျိုးမျိုး သတ်မှတ်ကြည့်ကြပါစို့။

<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: '!!!';
}

ဆက်လက်လေ့လာရန်

ပလတ်စတစ် အဲလီမင့် before,
အဲလီမင့်၏စာသားရှေ့တွင် စာသားထည့်သွင်းပေးသည်။
attr လုပ်ဆောင်ချက်,
အဲလီမင့်၏ attribute တန်ဖိုးကို ရယူပေးသည်။
counter-increment ဂုဏ်သတ္တိ,
အလိုအလျောက် နံပါတ်တပ်ပေးခြင်းကို သတ်မှတ်ပေးသည်။