相关属性
flex-direction:column
1.justify-content:flex-start (紧贴红线顶部)
2. justify-content: center (在红线上垂直居中)
3. justify-content: flex-end(在红线上垂直居中)
4. justify-content: space-between (沿红线均匀撑开)
5. justify-content: space-around (沿红线均匀分布)
1. flex-wrap: wrap (装不下就换行)
对比：flex-wrap: nowrap (默认，死活不换行)
2. flex-grow: 1 (平分剩余空间)
对比：flex-grow 比例分配 (1:2:3)
3. flex-shrink 演示 (空间不够时的退让)
对比：第三个盒子拒绝收缩 (flex-shrink: 0)
flex-direction:row
交叉轴方向
