flexbox简洁
FlexBox也叫弹性盒布局,在FlexBox弹性布局中，容器会根据需要调整条目的尺寸和顺序，填充空间。FlexBox主要有伸缩容器和伸缩项目组成。
FlexBox伸缩容器属性
display:flex|inline-flex 指定是否用弹性盒模型
flex-direction:row|row-reverse|column|column-reverse 控制伸缩容器在主轴的方向
flex-wrap:wrap|nowrap|wrap-reverse 用来控制是单行还是多行，默认值nowrap,单行
flex-flow:[flex-direction][flex-wrap]
justify-content:flex-start|flex-end|center|space-between|space-around 主轴的对齐方式
align-items:flex-start|flex-end|center|baseline|stretch在侧轴的对齐方式
align-content:flex-start|flex-end|center|space-between|space-around|stretch主轴方向伸缩行的对齐方式
FlexBox伸缩项目属性
order:定义项目的排列顺序，数值越小越靠前
flex:flex-grow(扩展比例) flex-shrink(收缩比例) flex-basis(伸缩基准)
align-self:auto|flex-start|flex-end|center|baseline|stretch 设置单独的伸缩项目在交叉轴上的对齐方式
在react-native中的应用
flex:number
flexDirection:row|column
alignItems
alignSelf
flexWrap justifyContent
