前端 flex布局

容器属性

1父容器

属性	值
display:	flex
justify-content主轴:	flex-start	flex-end	center	space-around	space-between
align-items副轴: 没有两端对齐	flex-start	flex-end	center	baseline	stretch默认

2 进阶

属性	值
flex-direction轴:	row默认	row-reverse	column	column-reverse
flex-wrap换行:	no-wrap默认	wrap	wrap-reverse
flex-flow上两个的结合:	row wrap
align-content多行副轴:	flex-start默认 flex-end	center	space-around space-between	stretch

项目属性

属性	值
flex-grow:	放大比例,默认为0，即如果存在剩余空间，也不放大。
flex-shrink:	缩小比例,默认为1，即如果空间不足，该项目将缩小
flex-basis:	原始尺寸的宽 px或auto默认
flex:	flex-grow flex-shrink flex-basis的简写，默认值为 0 1 auto。 后两个属性可选。比如flex:1
order:	12345
align-self副轴:	flex-start / flex-end / center / baseline / stretch / auto默认与父同