


/* 父元素-flex容器 */
.flex{display: flex;display: -moz-box; /* Firefox 17- */  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  display: -moz-flex; /* Firefox 18+ */  display: -ms-flexbox; /* IE 10 */}

/* 父元素-纵向排列（主轴） */
.flex-column{-webkit-box-orient: vertical;flex-direction: column;-webkit-flex-direction: column;-ms-flex-direction: column;-moz-flex-direction: column;-o-flex-direction: column;}

/* 子元素-平均分栏 */
.flex1{-webkit-flex: 1; /* Chrome */-ms-flex: 1; /* IE 10 */flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */-webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */-moz-box-flex: 1; /* OLD - Firefox 19- */}

/* 父元素-横向换行 */
.flex-wrap{-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;}

/* 父元素-竖直居中（主轴是横向才生效） */
.align-center{-webkit-box-align: center;-moz-align-items: center;-ms-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;}
.align-start{-webkit-box-align: start;-moz-align-items: flex-start;-ms-align-items: flex-start;-o-align-items: flex-start;-webkit-align-items: flex-start;align-items: flex-start;}
.align-end{-webkit-box-align: end;-moz-align-items: flex-end;-ms-align-items: flex-end;-o-align-items: flex-end;-webkit-align-items: flex-end;align-items: flex-end;}

/* 父元素-水平居中（主轴是横向才生效） */
.justify-center{-webkit-box-pack: center;-ms-justify-content: center;-moz-justify-content: center;-o-justify-content: center;-webkit-justify-content: center;justify-content: center;}
.justify-between{-webkit-box-pack: justify;-ms-justify-content: space-between;-moz-justify-content: space-between;-o-justify-content: space-between;-webkit-justify-content: space-between;-webkit-justify-content: space-between;justify-content: space-between;}
.justify-around{-webkit-box-pack: justify;-ms-justify-content: space-around;-moz-justify-content: space-around;-o-justify-content: space-around;-webkit-justify-content: space-around;-webkit-justify-content: space-around;justify-content: space-around;}
.justify-end{-webkit-box-pack: end;-ms-justify-content: flex-end;-moz-justify-content: flex-end;-o-justify-content: flex-end;-webkit-justify-content: flex-end;-webkit-justify-content: flex-end;justify-content: flex-end;}






