flex布局

167 阅读1分钟

//设置容器内部元素的排列方向

flex-direction: row

row:定义排列方向 从左到右
row-reverse: 从右到左
column: 从上到下
coumn-reverse: 从下到上

//设置元素在主轴上的对其方式

justify-content: space-around

flex-start   (默认)左对齐
flex-end    右对齐
center: 	居中对齐
space-between: 两端对齐,元素之间平均等分剩余空白间隙部分
space-around: 元素两边品骏等分剩余空白间隙部分,最左或最右和元素之间距离是1:2