但是当flex-direction的属性值是column，对应的主轴就应该垂直向下。
具体应用示例如下：
2. flex-wrap
flex-wrap属性控制Flex项目是否换行。默认情况下，Flex容器会在一行内容纳所有的Flex项目，因为flex-wrap属性的默认值是nowrap，也就是不换行。
具体应用示例如下：
其中wrap-reverse表示Flex项目在容器中多行排列，只是方向是反的。
3. flex-flow
flex-flow是flex-direction和flex-wrap两个属性的速记属性。
具体不再解释，看下面示例即可：
4. justify-content
justify-content属性，控制Flex项目在整个Main-Axis上的对齐方式。
justify-content的默认属性值是flex-start。
space-between让flex项目两端对齐。
space-around让每个flex项目具有相同的空间
5. align-items
align-items控制Flex项目在Cross-Axis对齐方式。
align-items的默认值是stretch，让所有的Flex项目高度和Flex容器高度一样，铺展开。
baseline
让所有flex项目在Cross-Axis上沿着他们自己的基线对齐。
其中stretch和baseline在不设置具体高度值，才会如上表现，否则会显示固定的高度。
align-content属性与align-items作用相同，不过该属性只针对多行，对单行无效。
三、Flex项目
接下来继续介绍Flex项目的具体属性及使用方法。
| 属性 | 值 | 含义 |
|---|---|---|
| order | 数值 | 根据 order 值重新排序。从底到高。 |
| flex-grow | 0 || positive number | 控制Flex项目在容器有多余的空间如何放大 |
| flex-shrink | 0 || positive number | 控制Flex项目在容器 没有额外空间又如何缩小 |
| flex-basis | auto || % || em || rem || px | 指定Flex项目的初始大小 |
| align-self | auto || flex-start || flex-end || center || baseline || stretch | 控制单个Flex项目在 Cross-Axis 对齐方式 |
1. order
order允许Flex项目在一个Flex容器中重新排序，属性默认值是0。
依据order值的大小进行排序，按照值从低到高依次排序。
默认情况下，排序如下：
