flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。
如果元素不是弹性盒模型对象的子元素，则 flex 属性不起作用。
设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。
容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
项目默认沿主轴排列。单个项目占据的主轴空间叫做main size，占据的交叉轴空间叫做cross size。
justify-content属性定义了项目在主轴上的对齐方式。
align-items属性定义项目在交叉轴上如何对齐。
注意：区分设置在容器上的属性和设置在项目上的属性
直接去看阮一峰老师的博文吧，写的很详细~
强烈推荐：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
http://www.ruanyifeng.com/blog/2015/07/flex-examples.html