在父元素设置
display:flex;
s三个设置协助:
- flex-direction 规定灵活项目的方向
flex-direction:colum; //垂直
- flex-wrap 定义,如果一条轴线排不下,如何换行。
flex-wrap: nowrap | wrap | wrap-reverse; //不换行| 换行 | 换行,第一行在下方
- justify-content 规定元素在方向上的对齐方式
justify-content: flex-start|flex-end|center|space-between|space-around|initial|inherit;
align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;
- align-content 属性定义了多根轴线的对齐方式