弹性盒常用属性

添加浏览器前缀： -webkit

display:-webkit-flex; *如果用了弹性布局，子元素不需要浮动

display:flex; 容器添加弹性布局后，显示为块级元素；
display:inline-flex; 容器添加弹性布局后，显示为行级元素；

注意：设为 Flex布局后，子元素的float、clear和vertical-align属性将失效。但是position属性，依然生效

-webkit-justify-content： 子元素水平排列方式方式。

			center　　　　　　水平居中　　　　
			space-between　　两端对齐　　　　　　　　
			space-around　   手拉手平均分
			flex-start　　   居左对齐
			flex-end　　　   居右对齐

-webkit-align-items：　　 子元素垂直排列

		   center             垂直居中
		   space-between      垂直两端对齐
		   space-around       手拉手上下平均分
		   flex-start         顶部对齐
		   flex-end           底部对齐
		   baseline: 项目的第一行文字的基线对齐。(文字的行高、字体大小会影响每行的基线)

-webkit-flex-direction：　 排列方式

		   row    水平排列-默认值
		   row-reverse： 主轴在水平方向，起点在右端 ；
		   column 垂直排列
		   column-reverse：主轴为垂直方向，起点在下沿。

-webkit-flex-wrap： 　　　默认no-wrap让元素步换行

		    wrap       换行
		    nowrap     不换行
		    wrap-reverse： 换行，并且第一行在容器最下方。

-webkit-align-content: 　　控制容器内多行在Y轴上的排列方式

		    stretch　　　　　　默认值，如果项目未设置高度或设为auto，将占满整个容器的高度
		    center　　　　　　 居中对齐
		    flex-start 　　   顶部对齐
		    flex-end    　　  底部对齐
		    space-between　　 上下对齐
		    space-around　　　上下手拉手对齐