flex弹性盒子
display:flex把盒子设置成弹性盒子
flex-direction:row排列顺序
rowx轴默认值从左到右 row-reverse 从右到左
column y轴默认从上到下 column 从下到上
flex-wrap 资源在父盒子中是否换行
nowrap 默认不换行和列 wrap 换行列 wrap-reverse 换行列但是以想法的顺序简写
flex-flow:排序 换行:
Justify-content 用来存在剩余看空间时,设置为间距的方式 Flex-start 从左到右挨着 flex-end 从右到左挨着 center 中心显示 Space-between 平均分布 两边不留间隙 Space-around 平均分布 两边留间隙
align-items:
flex交叉轴的对齐方式 把每一个子元素当成一个独立的个体处理 Flex-start 交叉轴顶部flex-end 交叉轴底部 center 中间
align-content把多行的内容当成一个整体处理
Flex-start :
容器开头flex-end 容器结尾 center容器中心 Space-between
间有空白 Space-around 两端留有空白