5、align-items属性

align-items属性定义项目在交叉轴上如何对齐。

.box { align-items: flex-start | flex-end | center | baseline | stretch; }

flex-start flex-end center baseline stretch

flex-start:交叉轴的起点对齐。

1
2
3
4

flex-end:交叉轴的终点对齐。

1
2
3
4

center:交叉轴的中点对齐。

1
2
3
4

baseline: 项目的第一行文字的基线对齐。

1
2
3
4

stretch(默认值):如果项目未设置高度或设为auto,将占满整个容器的高度。

1
2
3
4