该文是本人的译文，如想看原文请点击传送门
如需转载请注明来源与作者
讲解分为两部分，一部分讲解的是
container的属性，另一部分讲解children属性。本文讲解
children的属性。讲解的另外一篇传送门。
本文讲的是在flex items上的属性
order
在默认情况下，
flex items排布顺序是按照资源的顺序。但是，order属性可以控制在flex container下的子元素的顺序。
.item{
oreder: <整数> ;
}
flex-grow
这个属性定义了弹性元素扩展的能力。它能够接受无单位的值来用作占比。它规定了弹性容器下的弹性元素可以占据多少的可用空间。
如果所有的items都有flex-grow等于1，容器内的剩余空间会等分地分配到每一个元素。如果其中某一个元素有是2的值，那么这个元素会占据的剩余空间相当于其他元素的2倍。
.item{
flex-grow: <number>;/*默认值为0，并且其中负值是非法的。*/
}
flex-shrink
这个属性定义了弹性元素会在必要的时候会收缩。
.item {
flex-shrink: <number>; /* 默认值为1 ，并且负值是非法的*/
}
flex-basis
这个属性定义在剩余空间被分配之前默认情况下元素的大小。这个值可以是长度（比如：20%，5rem等等）或者是一个关键词。
auto关键词意味着"着眼于我的宽度或者高度"(这会临时用于主尺寸关键字，直到被抛弃)。关键词`content指"内容决定尺寸"-这个关键字还没有得到较好的支持，所以测试比较困难，并且难以得到它的兄弟元素最大内容最小内容和最佳内容。
.item{
flex-basis:<length>|| auto ; /*默认值：auto*/
}
如果设置为0，包围内容的额外空间不会计算在内。如果设置为
auto，那么剩余空间将会按照flex-grow进行分配。
flex
这是
flex-grow,flex-shrink,flex-basis的简写。第二个和第三个参数是可选的(flex-shrink,flex-basis是可选项)。flex的默认值是0，1，auto；
···
.item{
flex:none | [ <'flex-grow'> <'flex-shrink'>?|| <'flex-basis'> ]
}
···
推荐你使用简写的属性，而不是去设置单一的属性。简写设置其他值是非法的。
align-self
这个属性允许默认的对齐方被覆盖（或者通过align-self指定一个元素）
.item{
align-self: auto | flex-start | flex-end | center | baseline | stretch;
}
NOTE:
float,clear,vertical-align对弹性元素不起作用
