如果flex容器中的元素在换行后没有对齐,通常是因为该align-items属性设置为其默认值stretch.当此属性设置为时stretch,弹性项目将被拉伸以填充容器的高度。
要将弹性项目对齐到容器的顶部,您可以将align-items属性设置为flex-start.这会将项目沿横轴对齐到容器的开头。
这是一个例子:
.container{
display:flex;
flex-wrap:wrap;
align-items:flex-start;
}
在此示例中,该flex-wrap属性设置wrap为允许项目在没有足够空间时换行到下一行。该align-items属性设置为flex-start将项目对齐到容器的顶部。
您还可以为该align-items属性使用其他值,例如center将项目对齐到容器的中心或flex-end将项目对齐到容器的底部。