flex布局的使用

1 给父元素设置dispaly：flex 

子元素默认按照水平排列

flex-direction：column 垂直排列

flex-wrap:wrap 实现多行排列

align-conten 控制多行排列时的间距跟justify-content属性相似

2 justify-content 设置元素在水平方向的对齐方式

center：居中

space-around：子元素两侧距离均匀

space-between：子元素之间距离均匀

space-eventy：所有距离相等

3 align-items设置元素在侧轴的对齐方式

center 居中

stretch 铺满侧轴 字迹元素无高度

4 align-self 单独设置一个子元素的侧轴

5 flex+数字 表示子元素占父级元素剩下的份数

总结弹性布局的特点：不给宽高默认是内容的大小