Flex items会向交叉轴的结束位置靠拢。
.flex-container { -webkit-align-content: center; /* Safari */ align-content: center; }
flex items的行会在交叉轴上居中显示。
.flex-container { -webkit-align-content: space-between; /* Safari */ align-content: space-between; }
每一行都会有相同上下间隔。
默认值：stretch
注：这个属性只会在flex container有多行的时候才会有效，如果只有一行那么这个属性就不会有效果。
关于flex containers
- 所有的
column-*属性在flex container上都不会有效果 ::first-line与::first-letter伪类在flex container上不会被应用。
FlexBox Item 属性
Order
order属性定义子元素在父容器中的顺序，默认它们会被最加到后面。
例子：
.flex-item { -webkit-order: <integer>; /* Safari */ order: <integer>; }
不需要调整HTML，就能修改显示顺序。
默认值:0
flex-grow
这个属性是一个flex拉伸因子，决定了flex items会相对于父容器剩余空间增长多少。
.flex-item { -webkit-flex-grow: <number>; /* Safari */ flex-grow: <number>; }
如果所有flex items都有相同的flex-grow，那么他们都会在父容器中有相同的尺寸。
调整一下，看看有什么区别。
默认值：0
注：负数是不合法的
flex-shrink
flex-shrink是一个flex收缩因子，它决定了当父容器体积不足时，flex items收缩的相对比例。
.flex-item { -webkit-flex-shrink: <number>; /* Safari */ flex-shrink: <number>; }
默认所有flex items都是可以压缩的，但如果我们把它设为0，那么它将保持原有大小。
默认值： 1
注：负数是不合法的。
flex-basis
这个属性会设置宽度和高度，
原文为：This property takes the same values as the width and height properties
并在flex因子分割间隔之前，指定flex items的初始大小。
.flex-item { -webkit-flex-basis: auto | <width>; /* Safari */ flex-basis: auto | <width>; } flex-basis会指定第四个flex items的初始大小。
flex-basis会指定第四个flex items的初始大小。
默认值： auto。
flex
这个属性是flex-grow,flex-shrink和flex-basis属性的缩写。
.flex-item { -webkit-flex: none | auto | [ <flex-grow> <flex-shrink>? || <flex-basis> ]; /* Safari */ flex: none | auto | [ <flex-grow> <flex-shrink>? || <flex-basis> ]; }
默认值：0 1 auto
注：w3c鼓励使用简写，而不是每个属性都分开写。
align-self
这个属性允许为单个flex items重写对齐方式。、
.flex-item { -webkit-align-self: auto | flex-start | flex-end | center | baseline | stretch; /* Safari */ align-self: auto | flex-start | flex-end | center | baseline | stretch; }
默认值：auto
注：The value of auto for align-self computes to the value of align-items on the element’s parent, or stretch if the element has no parent.
关于 flex items
float,clear，vertical-align在flex item上都不会有作用，也不会让它脱离文档流。
