စက်တင်ပုံအစုစု အကြိုးအဝိုင်း
အသုံးပြုခြင်း နှင့် အဓိပ္ပာယ်
CSS @container
အချက်အလက်များသည် အကွက်အရောက်၏ အကြီးအကျယ်အားသို့မဟုတ် အော်ဒါအုပ်ချုပ်ခြင်းအား ပြုလုပ်သော အချက်အလက်များကို သတ်မှတ်ပါ
အချက်အလက် အသုံးပြုခြင်းသည် အခြေအနေအချက်အရာများအပေါ် စစ်ဆေးပြီး အခြေအနေအချက်အရာများသည် အခြေအနေအချက်အရာများဖြစ်လျှင် အကွက်အရောက်အပေါ် အသုံးပြုပါ။ အကွက်အရောက်၏ အကြီးအကျယ်အားသို့မဟုတ် အော်ဒါအုပ်ချုပ်ခြင်းအား ပြောင်းလဲလျှင် အခြေအနေအချက်အရာများ အပြန်စစ်ဆေးပြီး ပြောင်းလဲပေါ်ပါ
အကြောင်းကြားဘာသာစကားသုံးစွဲသူတွေ၏ CSS တွင် အကွက်အရောက်သည် အခြားအရာများကို အုပ်ချုပ်သော အကွက်အရောက်တစ်ခုဖြစ်၍ အုပ်ချုပ်သော အုပ်ချုပ်ခြင်းကို ပြုလုပ်သည်။
အကြောင်းကြား
အကွက်အရောက်၏ အကြီးအကျယ်အားသို့မဟုတ် အော်ဒါအုပ်ချုပ်ခြင်းအား အခြေအနေအချက်အရာများကို သတ်မှတ်ပါ
.parent { container-name: myContainer; container-type: inline-size; } /* Add styles if myContainer is less than 500px wide */ @container myContainer (width < 500px) { .child { width: 50%; border: 2px solid maroon; background-color: salmon; } }
CSS အသုံးပြုခြင်း
@container containername (containerquery) { css declarations }
အချက်အလက် အတ္ထုပ်
အတ္ထုပ် | သတ်မှတ်ချက် |
---|---|
containername | အပိုင်းအခြားသည် လိုအပ်သော အခြေအနေအချက်အရာများ |
containerquery |
အပိုင်းအခြားသည် လိုအပ်သော အခြေအနေအချက်အရာများ တွင် containerquery တွင် အောက်ပါ သတ်မှတ်ချက်များကို အသုံးပြုသည်:
|
ဘာသာစကားသုံးစွဲသူတွေ၏ အထောက်အပံ့
အချက်အလက်များသည် ဒီ @ အာဏာအုပ်ချုပ်ခြင်းကို အထ်ကမ်းစားသော ဘာသာစကားသုံးစွဲသူတွေ၏ ပထမဆုံး ပုံစံတွင် ပါဝင်သည်။
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
105 | 105 | 110 | 16 | 91 |