CSS中的Flexbox布局可以用來快速設(shè)計(jì)并調(diào)整網(wǎng)頁上的元素排列和位置。在Flexbox布局中，主軸方向是指排列元素的方向，可以是水平的（從左到右）和垂直的（從上到下）兩種方向，而交叉軸方向是與主軸垂直的方向。

在默認(rèn)情況下，F(xiàn)lexbox布局的主軸方向是從左到右的水平方向。但如果我們需要垂直方向的主軸方向，可以使用CSS中的"flex-direction"屬性。該屬性可以設(shè)置以下四個(gè)值之一：

.flex-container{
display: flex;
flex-direction: row; /*默認(rèn)值*/
}
.flex-container{
display: flex;
flex-direction: row-reverse; /*行反向*/
}
.flex-container{
display: flex;
flex-direction: column; /*豎向*/
}
.flex-container{
display: flex;
flex-direction: column-reverse; /*列反向*/
}

以上代碼分別設(shè)置了flex-direction屬性的四種取值方式。其中，"row"表示從左到右的水平方向；"row-reverse"則表示從右到左的水平方向；"column"表示從上到下的垂直方向；而"column-reverse"則表示從下到上的垂直方向。

通過使用"flex-direction"屬性，我們可以輕松地改變Flexbox布局的主軸方向，以適應(yīng)不同的布局需求。而對于需要同時(shí)改變主軸方向和交叉軸方向的情況，則可以使用"flex-wrap"和"justify-content"屬性分別控制換行和對齊等特性。