flex-d 是一个 CSS 属性，用于设置 flex 容器的主轴方向。如果你想让 flex 容器在纵向（垂直）方向上换行，你可以将该属性设置为 "column" 或 "column-reverse"。
例如，以下 CSS 代码可以让 flex 容器在纵向方向上换行：
.container {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
上述代码中，flex-direction 属性被设置为 "column"，这表示 flex 容器的主轴方向为纵向。同时，flex-wrap 属性被设置为 "wrap"，这表示 flex 子项应该在需要时换行。这样，当 flex 容器的高度不足以容纳所有子项时，子项会从上到下自动换行。如果你想要反向排列，可以将 flex-direction 设置为 "column-reverse"。
当 flex-direction 属性被设置为 "column" 时，flex 容器的主轴方向是纵向的，而交叉轴方向是横向的。在这种情况下，flex-wrap 属性就控制了子项如何在容器内进行换行。
如果 flex-wrap 属性的值为 "nowrap"，那么所有的子项都会在一行内排列，即使容器的高度不足以容纳所有的子项。而如果 flex-wrap 属性的值为 "wrap"，则 flex 子项会在需要时进行自动换行。例如，如果子项的总高度超过了容器的高度，那么子项就会从上到下自动换行，每一行的子项会尽可能地充满容器的宽度。
如果你希望子项在纵向方向上排列时，每行的子项数量是固定的，可以将 flex-wrap 属性设置为 "wrap"，同时再加上一个 flex-basis 属性。flex-basis 属性用于指定 flex 子项在主轴方向上的初始大小，可以用像素、百分比或者其他长度单位来设置。例如，以下 CSS 代码可以让 flex 容器在纵向方向上换行，每行最多显示 3 个子项：
.container {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.item {
flex-basis: calc(33.33% - 10px);
}
上述代码中，我们将 flex-wrap 属性设置为 "wrap"，这表示 flex 子项应该在需要时换行。同时，我们给每个子项都设置了一个 flex-basis 属性，这样每个子项在主轴方向上的初始大小都相同，都是 33.33%。由于每个子项之间还有 10 像素的间隔，所以我们用 calc() 函数来计算每个子项的实际宽度。这样，当容器的高度不足以容纳所有子项时，子项会从上到下自动换行，每行最多显示 3 个子项。