RN布局（三）——伸缩项目的属性

1.order

定义项目的排列顺序&＃xff0c;数值越小&＃xff0c;排列越靠前&＃xff0c;默认值为0&＃xff0c;语法为&＃xff1a;order&＃xff1a;整数值

2.flex-grow

定义伸缩项目的放大比例&＃xff0c;默认值为0&＃xff0c;即表示如果存在剩余空间&＃xff0c;也不放大&＃xff0c;语法为&＃xff1a;flex-grow&＃xff1a;整数值

3.flex-shrink

定义伸缩项目的收缩能力&＃xff0c;默认值为1 &＃xff0c;其语法为&＃xff1a;flex-shrink:整数值

4.flex-basis

用来设置伸缩项目的基准值&＃xff0c;剩余的空间按比率进行伸缩&＃xff0c;其语法为&＃xff1a;flex-basis:length | auto&＃xff0c;默认值为auto

5.flex

是flex-grow flex-shrink flex-basis这三个属性的缩写&＃xff0c;其语法为&＃xff1a;flex:none | flex-grow flex-shrink flex-basis&＃xff0c;其中第二个和第三个参数为可选参数&＃xff0c;默认值为&＃xff1a;0 1 auto

6.align-self

用来设置单独的伸缩项目在交叉轴上的对齐方式&＃xff0c;会覆盖默认的对齐方式&＃xff0c;其语法为&＃xff1a;align-self:auto | flex-start | flex-end | center | baseline | stretch(伸缩项目在交叉轴方向占满伸缩容器&＃xff0c;如果交叉轴为垂直方向的话&＃xff0c;只有在不设置高度的情况下才能看到效果)