flex弹性盒子常用属性

flex弹性盒子常用属性

属性	值	描述
display	flex	定义一个盒子为弹性盒子
flex-direction	row	子盒子水平排列，从左到右
	row-reserve	子盒子水平反向排列
	column	子盒子垂直排列，从上到下
	column-reserve	子盒子垂直反向排列
flex-wrap	no-wrap	子盒子不换行,默认
	wrap	子盒子不换行
	wrap-reverse	换行并改变顺序
justify-content	flex-start	flex子元素在最左边
	flex-end	flex子元素在最右边
	center	flex子元素在正中间
	space-between	平分flex容器
	space-around	平分flex容器,但是每个子元素两边是子元素间距的一半
align-content	flex-start	flex子元素在最上边
	flex-end	flex子元素在最下边
	center	flex子元素在纵向正中间
	space-between	纵向平分flex容器
	space-around	纵向平分flex容器,但是每个子元素两边是子元素间距的一半
	stretch	默认：li将ul划分
align-items	flex-start	flex子元素在最上边
	flex-end	flex子元素在最下边
	center	flex子元素在纵向正中间
	baseline	如弹性盒子元素的行内轴与侧轴为同一条，则该值与'flex-start'等效。其它情况下，该值将参与基线对齐
	stretch	高度100%,宽度自动
align-self	flex-start	flex子元素在最上边
	flex-end	flex子元素在最下边
	center	flex子元素在纵向正中间
	baseline	如弹性盒子元素的行内轴与侧轴为同一条，则该值与'flex-start'等效。其它情况下，该值将参与基线对齐
	stretch	高度100%,宽度自动
order	1(number)	改变顺序
flex	1(number)	该元素占子元素剩余位置的比例