伸缩布局flex

*父元素display:flex; 子元素所占份数 flex:1;

*min-width:500px;最小宽度，不再随窗口缩小    max-width:1000px;最大宽度

*flex-direction:column;排列方式垂直，默认水平方向row

*justify-content:flex-start|flex-end|center|space-between|space-around;调整主轴水平对齐

*align-item:stretch|center|flex-start|flex-end; 调整侧轴垂直对齐（单行）

*flex-wrap:nowrap|wrap; 控制是否换行，默认不换行

*flex-flow是flex-direction和flex-wrap的简写

*align-content：stretch|center|flex-start|flex-end|space-between|space-around; 堆栈（由flex-wrap产生的独立行）对齐   （多行）

必须写：display:flex; flex-wrap:row wrap;

*order控制子项目的排列顺序，数值小排在前面，可以为负数，默认为0；    order:0;