CSS Flexbox: 将水平布局改为垂直布局

将水平布局改为竖向布局可以使用以下 CSS 代码：

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 20px;

解释：

• display: flex;: 将元素设置为 Flexbox 布局。
• flex-direction: column;: 将主轴方向设置为垂直方向，使元素从上到下排列。
• align-items: center;: 将项目在交叉轴上居中对齐。
• justify-content: center;: 将项目在主轴上居中对齐。
• margin-top: 20px;: 设置元素上边距为 20 像素。

通过修改 flex-direction 属性，可以轻松地将水平布局转换为垂直布局，并使用其他 Flexbox 属性对元素进行精细控制。