微信小程序布局（一）

flex的容器和元素

flex容器属性详解:

flex-direction 决定元素的排列方向

    有两个值，row：横向排序，colmn：竖向排序，默认为row

flex-wrap 决定元素如何换行（排列不下时）

    有三个值，nowrap：不换行，wrap：换行，wrap-reverse：反转，默认为nowrap

flex-flow 是flex-direction和flex-wrap的简写

    可以将flex-direction和flex-wrap参数一并卸载后面

justify-content 元素在主轴上的对齐方式

    center：居中对齐，  justify-content: flex-start：从左边开始依次排序，flex-end：从右边 开始依次对齐，space-around：是每一个元素按一定间隔排序，space-between：间隔一 样

align-items 元素在交叉轴的对齐方式

    上下中方位

 

flex容器属性详解:

flex-grow 当有多余空间时，元素的放大比例

flex-shrink 当空间不足时，元素的缩小比例

flex-basis 元素在主轴上占据的空间

flex是grow、shrink、basis的简写

order 定义元素的排序顺序

align-self 定义元素自身的对齐方式