再次搞懂弹性盒模型

父级{

1.  display: -webkit-flex;  声明弹性盒模型

2. flex-flow 复合写法  ( flex-flow:row wrap;)

        2.  flex-direction;决定子集标签的排列方向  row 从左到右,row-reverse 从右到左, column 垂直方向,column-reverse 垂直从下到上

        3.  flex-wrap:; 是否换行默认不换行   wrap换行 wrap-reverse 换行从底开始



3.   justify-content ;对齐方式    flex-start 左边对齐 | flex-end 尾巴对齐 | center 居中对齐 | space-between 两端对齐 中间平分| space-around 每个两边都相等;

}

4.  align-items  垂直方向的对齐方式; flex-start顶部对齐  flex-end 终点对齐    center 居中 

 子集{

 flex: 4; 可以直接写占用的分数 也可以写  width:500px  这样固定宽度,其他的就是自动自适应布局

}

原文地址:https://www.cnblogs.com/nice2018/p/9660960.html