CSS @کونٹینر رول

کورس سفارش:

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

قوانین، دیگر عناصر کی انداز کا تعین کرنے کے لئے کانٹینر کی بڑائی یا انداز پر منحصر ہوتی ہیں。

استایل کا اظہار معیار کی بنیاد پر فیلٹر کیا جائے گا، اگر معیار حقیقی ہو تو کانٹینر پر استایل کا استعمال کیا جائے گا۔ جب کانٹینر کی بڑائی یا انداز کا مقدار تبدیل ہو تو معیار دوبارہ جائزہ لیا جائے گا。نکات:

در CSS میں، کانٹینر ایک عناصر کا نام ہے جو دیگر عناصر کو محفوظ کرتا ہے، تاکہ وہ انداز میں جمع کئے جاسکیں اور استایل کا استعمال کیا جاسکے。

مثال

بقایا عناصر کی انداز کا تعین کریں جو کانٹینر کی بڑائی یا انداز پر منحصر ہو
  .parent {
  container-name: myContainer;
css declarations
container-type: inline-size;
/* اگر myContainer کم از 500 پیکسلو وسیع ہو تو استایل اضافہ کریں */
  @container myContainer (width < 500px) {
    .child {
    width: 50%;
    border: 2px solid maroon;
  css declarations
css declarations

background-color: salmon;

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

CSS گرامر وصف @containercontainerquery(
  ) {
css declarations

}

بروسر کی پشتیبندی

جداول میں نمبرات، ابتدائی بروسر کی نسخہ کا نمائش کرتا ہے جو اس @ قوانین کو پورا طور پر پشتیبند کرتا ہے。