移动端flex布局

1.flex给父级添加属性：

flex-direction：设置主轴的方向（默认是横向的，）
justify-content：设置主轴上的子元素排列方式
flex-warp：设置子元素是否换行
align-content：设置侧轴上的子元素的排列方式（多行）
align-items：设置侧轴上的子元素的排列方式（单行）

justify-content：

flex-warp：在flex盒子内，没有设置flex-warp时，如果子盒子总共的宽度超过了父盒子的宽度，flex会自动缩小子盒子的宽度，不会换行显示

align-content：

align-content：必须在有flex-warp时才能使用

flex布局子元素常见的属性：

flex：子项目占的份数（flex设置1可以占满剩余可以使用的空间）
align-self：控制子项自己在侧轴的排列方式
order属性定义子项的排列顺序（前后顺序）

align-self：

order：