পসিউডো এলিমেন্ট after

পসিউডো এলিমেন্ট after টেক্সট সন্নিবেশ করে এলিমেন্টের পরে। শুধুমাত্র content প্রপার্টির সাথে একত্রে ব্যবহার করা হয়, যা সন্নিবেশ করার টেক্সট নির্দিষ্ট করে।

সিনট্যাক্স

cssসিলেক্টর::after {
  content: 'টেক্সট';
}

উদাহরণ

আসুন এমন করি যাতে li-এর উপর হোভার করলে এর শেষে টেক্সট সন্নিবেশিত হয়:

html<ul>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
</ul>

cssli:hover::after {
  content: '!!!';
}

Результат:

উদাহরণ

সন্নিবেশিত টেক্সটে বিভিন্ন স্টাইল প্রয়োগ করা যায়। উদাহরণস্বরূপ, এই টেক্সটটিকে কোনো একটি রঙে রাঙানো যাক:

html<ul>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
  <li>لলিস্ট আইটেম</li>
  <li>লিস্ট আইটেম</li>
</ul>

cssli:hover::after {
  color: red;
  content: '!!!';
}

Результат:

আরও দেখুন