弹性盒子等分竖状排列一行

弹性盒子布局（Flexbox）是一种现代CSS布局模型，特别适合于创建响应式、灵活的网格系统。当你需要在一排元素中等分空间，并保持它们在不同屏幕尺寸下自动调整位置和大小时，可以使用 Flexbox 的 `flex-direction` 属性设置为 `column`（竖直方向），然后配合其他属性如 `justify-content` 和 `align-items` 来控制行内对齐。

例如，你可以这样做：

.container {
  display: flex;
  flex-direction: column; /* 竖直方向 */
  justify-content: space-between; /* 元素之间等间距分布 */
  align-items: center; /* 各元素居中对齐 */
}

在这个例子中，`.container` 中的所有子元素会按照从上到下的顺序等分垂直空间，并且每个元素顶部和底部与其他元素有一定距离。如果你想要改变行内的对齐方式，可以更改 `align-items` 的值，比如 `align-items: flex-start` 或 `align-items: flex-end`。