পসিউডো এলিমেন্ট before
পসিউডো এলিমেন্ট before টেক্সট সন্নিবেশ করে
এলিমেন্টের আগে। শুধুমাত্র ব্যবহার করা হয় content
প্রপার্টির সাথে সমন্বয়ে,
যা সন্নিবেশিত করার টেক্সট নির্ধারণ করে।
সিনট্যাক্স
সিলেক্টর::before {
content: 'টেক্সট';
}
উদাহরণ
আসুন এমন করা যাক যাতে যখন
li-এর উপর হোভার করা হয় তখন এর শুরুতে টেক্সট সন্নিবেশিত হয়:
<ul>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
</ul>
li:hover::before {
content: '!!!';
}
:
উদাহরণ
সন্নিবেশিত টেক্সটে বিভিন্ন স্টাইল প্রয়োগ করা যেতে পারে। উদাহরণস্বরূপ, এই টেক্সটটিকে কোনো একটি রঙে রাঙানো যাক:
<ul>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
<li>তালিকার আইটেম</li>
</ul>
li:hover::before {
color: red;
content: '!!!';
}
:
আরও দেখুন
-
পসিউডো এলিমেন্ট
after,
যা ট্যাগের টেক্সটের পরে সন্নিবেশ করে -
ফাংশন
attr,
যা ট্যাগের অ্যাট্রিবিউটের মান পায় -
প্রপার্টি
counter-increment,
যা স্বয়ংক্রিয় সংখ্যায়ন নির্ধারণ করে