စက်တင်ကျည်း flex-wrap အကျယ်အဝန်

  • အရှေ့ဆုံးစာကြိမ် flex-shrink
  • နောက်ဆုံးစာကြိမ် float

定义和用法

flex-wrap 属性规定弹性项目是否应换行。

注释：如果元素不是弹性项目，则 flex 属性无效。

另请参阅：

CSS 教程： CSS 弹性框

CSS 参考手册：flex 属性

CSS 参考手册：flex-basis 属性

CSS 参考手册：flex-direction 属性

CSS 参考手册：flex-flow 属性

CSS 参考手册：flex-grow 属性

CSS 参考手册：flex-shrink 属性

HTML DOM 参考手册：flexWrap 属性

实例

使弹性项目在需要时换行：

div {
  display: flex;   
  flex-wrap: wrap;
}

亲自试一试

CSS 语法

flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;

属性值

值 描述
nowrap 默认值。规定弹性项目不会换行。
wrap 规定弹性项目会在需要时换行。
wrap-reverse 规定弹性项目会在需要时换行，以反方向。
initial အခြေခံ အကျုံး ကို သုံးပြီး ထို့ကြောင့် initial。
inherit ဖြစ်သော အဖိုင်အမှုး မှ အခြေခံ အကျုံး ကို လက်ခံပြီး ထို့ကြောင့် inherit。

နည်းပါး

မူးယစ်ဆေး nowrap
ကြောက်စပ် မမရှိ
လှည့်ပြီး ဖြစ်သော ပုံစံ ထောက်ပံ့ခြင်း မရှိပါ။ ထို့ကြောင့်လှည့်ပြီး ဖြစ်သော အခြေခံ。
ပုံစံ CSS3
JavaScript ဘာသာ object.style.flexWrap="nowrap"

ဘတ်မက် ထောက်ပံ့

ဘတ်မက်တွင် အမှတ်ပြုထားသော နေရာတွင် အခြေခံ ဘတ်မက် သည် အခြေခံ အကျုံး ကို ထောက်ပံ့ပေးသည်。

ပါ -webkit- သို့မဟုတ် -moz- ဖြစ်သော နေရာတွင် အသုံးပြုသော ပထမဆုံး ပုံစံကို အမှတ်ပြုထားသည်。

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit-		 11.0 28.0
18.0 -moz-		 9.0
6.1 -webkit-		 17.0
  • အရှေ့ဆုံးစာကြိမ် flex-shrink
  • နောက်ဆုံးစာကြိမ် float