常用弹性布局及其兼容性写法

// 开启弹性布局
    display:-webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
// 定义子元素排列
	-webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -moz-box-orient:horizontal;
    -moz-box-direction:normal;     ( 子元素横向排列 默认 )
    box-orient:horizontal;
    box-direction:normal;
    -webkit-flex-direction:row;   
     flex-direction:row;
	 
	-webkit-box-orient:horizontal;
    -webkit-box-direction:reverse;
    -moz-box-orient:horizontal;
    -moz-box-direction:reverse;     ( 子元素横向反转排列 )
    box-orient:horizontal;
    box-direction:reverse;
    -webkit-flex-direction:row-reverse;
    flex-direction:column;

    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -moz-box-orient:vertical;
    -moz-box-direction:normal;      ( 子元素竖向排列 )
    box-orient:vertical;
    box-direction:normal;
    -webkit-flex-direction:row-reverse;
    flex-direction:row-reverse;
    
   
    -webkit-box-orient:vertical;
    -webkit-box-direction:reverse;
    -moz-box-orient:vertical;
    -moz-box-direction:reverse;      ( 子元素竖向反转排列 )
    box-orient:vertical;
    box-direction:reverse;
    -webkit-flex-direction:column-reverse;
    flex-direction:column-reverse;


// 定义子元素横向排列布局
	-webkit-justify-content:center;
	justify-content:center;
	-moz-box-pack:center;  				(横向据中排列布局)
	-webkit--moz-box-pack:center;
	box-pack:center;

    webkit--moz-box-pack:center;
    -webkit-justify-content:space-between;
    -moz-box-pack:center;
    -moz-justify-content:space-between;  (横向两边排列布局)
　  -ms-flex-pack: center;
    -ms-justify-content:space-between;
    box-pack:center;
    justify-content:space-between;

    -webkit-box-pack: center;
    -webkit-justify-content: space-around;
    -moz-box-pack:center;
    -moz-justify-content: space-around;
    -ms-flex-pack: center;
    -ms-justify-content: space-around;
    box-pack:center;
    justify-content: space-around;
	
// 定义子元素竖向排列布局
	align-items:center;
	-webkit-align-items:center;
	box-align:center;
	-moz-box-align:center;
	-webkit-box-align:center;

// 定义子元素换行
    -webkit-flex-wrap:wrap;
    -webkit-box-lines:multiple;
    -moz-flex-wrap:wrap;
    flex-wrap:wrap;


//



  -webkit-flex-flow:row wrap;
-webkit-box-orient:horizontal;
-webkit-box-lines:multiple;
-moz-flex-flow:row wrap;
box-orient:horizontal;
box-lines:multiple;
flex-flow:row wrap;



//  伸缩盒子布局兼容 flex:num;的兼容 
	box-flex:num;
	-webkit-box-flex:num;
	-moz-box-flex:num;
	-webkit-flex:num;
	flex:num;

//  元素出现顺序 order:num兼容
     box-order:num;
    -webkit-box-order:num;
    -moz-box-order:num;
    -webkit-order:num;
    order:num;