CSS ::before پوسچ الیمنٹ

تعریف و استعمال

CSS ::before پوسچ الیمنٹ، مقرر کی شده کی محتوائی کے پچھلے میں کچھ محتوا دودھ دکھائیں۔

استفاده کریں content قیمتی: content: " (" attr(href) ")";

• حرف: content: "Hello world!";
• تصویر: content: url(myimage.jpg);
• کوئی بات نہیں: content: none;
• شمارشگر: content: counter(li);
• کوئی بات نہیں: content: open-quote;
• قیمتی: content: " (" attr(href) ")";

ملاحظةً:توجہ دیں، دودھ دکھائی جانے والا محتوا وہی علامت کے اندر دودھ دکھائی جانے والا محتوا کے اندر آتا ہے۔ دودھ دکھائی جانے والا محتوا علامت کے اندر دوسرے محتوائی کے پچھلے میں شامل کیا جاتا ہے۔

استفاده کریں ::after مخصوص علامت کی محتوائی کے پچھلے میں کچھ محتوا دودھ دکھائیں。

مثال

مثال 1

کسی <p> علامت کی محتوائی کے پچھلے میں ایک حرف دودھ دکھائیں:

p::before {
  content: "Read this: ";
}

خود کا تجربہ کریں

مثال 2

کسی <p> علامت کی محتوائی کے پچھلے میں ایک حرف دودھ دکھائیں اور دودھ کی نمائش کی تکنیکات کو مقرر کریں:

p::before {
  content: "Read this -";
  background-color: yellow;
  color: red;
  font-weight: bold;
}

خود کا تجربہ کریں

CSS زبان معلومات

::before {
  css دفعات;
}

تکنیکی تفصیلات

براؤزر کی پشتیبانی

جداول میں شمارا تھا نوسی اس پوسچ الیمنٹ کی پورا پورا پشتیبانی کرنے والی پہلی براؤزر کی نسخہ نمبر کا حوالہ دیتا ہے。

مرتبط صفحه

درس:CSS پوسچ الیمنٹ

ملاحظةً:CSS ::after پوسچ الیمنٹ