CSS flex-grow အိမ်ခြံမြေ
ဥပမာ
ဒုတိယအချက်အား အခြားအရာများထက် သုံးဆပိုကျယ်စေပါ-
div:nth-of-type(1) {flex-grow: 1;}
div:nth-of-type(2) {flex-grow: 3;}
div:nth-of-type(3) {flex-grow: 1;}
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
flex-grow
ပစ္စည်း မည်မျှ တိုးလာမည်ကို ပိုင်ဆိုင်မှုသည် တူညီသော ကွန်တိန်နာအတွင်းရှိ အခြား ပြောင်းလွယ်ပြင်လွယ်ရှိသော အရာများနှင့် နှိုင်းယှဉ်ပါ ။
မှတ်ချက်- ဒြပ်စင်သည် ပြောင်းလွယ်ပြင်လွယ်ရှိသော အရာမဟုတ်ပါက၊ flex-grow
ပိုင်ဆိုင်မှုသည် အကျိုးသက်ရောက်မှု မရှိပါ။
မူလတန်ဖိုး: | ၀ယ်တယ်။ |
---|---|
အမွေဆက်ခံသည်- | မဟုတ်ဘူး |
သက်ဝင်လှုပ်ရှားနိုင်သော | ဟုတ်တယ် ကာတွန်း အကြောင်းဖတ်ပါ။ |
ဗားရှင်း- | CSS3 |
JavaScript syntax- | အရာဝတ္ထု .style.flexGrow="5" |
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ပိုင်ဆိုင်မှုကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
-webkit- သို့မဟုတ် -moz- ဖြင့်လိုက်သောနံပါတ်များကို ရှေ့ဆက်တွဲဖြင့်လုပ်ဆောင်သော ပထမဆုံးဗားရှင်းကို သတ်မှတ်ပါ။
Property | |||||
---|---|---|---|---|---|
flex-grow | 29.0 21.0 -webkit- |
11.0 | 28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |
CSS Syntax
flex-grow: number|initial|inherit;
အိမ်ခြံမြေတန်ဖိုးများ
Value | Description | Play it |
---|---|---|
number | A number specifying how much the item will grow relative to the rest of the flexible items. Default value is 0 | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
ဆက်စပ်စာမျက်နှာများ
CSS သင်ခန်းစာ- CSS Flexible Box
CSS ရည်ညွှန်းချက်- flex ပိုင်ဆိုင်မှု
CSS ရည်ညွှန်းချက်- flex-basis ပိုင်ဆိုင်မှု
CSS ရည်ညွှန်းချက်- flex-direction ပိုင်ဆိုင်မှု
CSS ရည်ညွှန်းချက်- flex-flow ပိုင်ဆိုင်မှု
CSS ရည်ညွှန်းချက်- flex-shrink ပိုင်ဆိုင်မှု
CSS ရည်ညွှန်းချက်- flex-wrap ပိုင်ဆိုင်မှု
HTML DOM ရည်ညွှန်းချက်- flexGrow ပိုင်ဆိုင်မှု