旧的display:box具有垂直对齐元素的能力,因此对于具有H定义高度的N个元素,它们将相对于父元素排列自己(垂直)对齐.
有没有办法使用当前dislpay:flex系统实现这一目标?
您正在寻找flex规则justify-content: space-between;.将它放在你的父元素上,它将对齐项目,使第一个接触容器的开头,最后一个接触容器的末端,剩下的空间分布在元素之间.
您还可以使用align-items在垂直于弯曲方向的方向上对齐元素.例如,如果你flex-direction是column(垂直),那么justify-content将垂直align-items对齐项目并将它们水平对齐.相反,如果你flex-direction是row(水平),那么justify-content将水平align-items对齐项目并将它们垂直对齐.
更多信息:https://css-tricks.com/snippets/css/a-guide-to-flexbox/