前端布局--flex布局

在设置flex布局之后，就不分行内元素，与块级元素了，给父盒子设置display:flex，父盒子会自动将子盒子设置成块级元素；

 

 

justify-content有一个好处是在页面缩小时，盒子不会不会掉下来，且保持大小不变；

当我们用以上的时候，其只能一行显示，即盒子不会掉下来，如果总是往里面塞盒子，最终，盒子大小会变小，来

达到不超过父盒子且在一行上的效果，所以我们可以用flex-wrap:wrap来使其表示当一行上盒子放不下时会换行

以上都是调主轴的，接下来是调整侧轴的：

 

 还有flex:1;这个是给子盒子加的，其作用是给子盒子以父盒子的剩余空间；flex:(这里面是占剩余空间的比例，如果有多个子盒子用了flex:,那么是根据里面的值来占比);