CSS 對齊方式是網頁設計中非常重要的一部分，可以讓我們更好地控制頁面的布局。其中，CSS 對齊方式 6（align-content）在 CSS3 中被引入，可以用來定義容器中的所有 flex 元素在垂直方向上的對齊方式。下面我們來詳細了解一下這個對齊方式。 使用 align-content 的前提是，容器需要設置 display:flex 或 display:inline-flex。align-content 屬性的可選值有以下幾種： - flex-start：所有的 flex 元素向容器的起始位置對齊； - flex-end：所有的 flex 元素向容器的結束位置對齊； - center：所有的 flex 元素在容器的縱向中間位置對齊； - space-between：所有的 flex 元素在容器的縱向空白處等間距分布； - space-around：所有的 flex 元素在容器的縱向空白處等距分布； - stretch（默認值）：所有的 flex 元素將被拉伸以適配容器。 例如，在以下代碼中，我們定義一個 flex 容器，其中有三個元素。容器的高度為 300px，元素的高度為 100px，使用 align-content:space-between 屬性，使得元素在縱向上等間距分布。

.flex-container{
display:flex;
align-content:space-between;
height:300px;
}
.flex-item{
height:100px;
background-color:red;
}

在實際應用中，CSS 對齊方式 6 的作用非常顯著。例如，當我們需要制作一個縱向居中的 flex 容器時，可以使用 align-items:center 將其所有元素垂直居中；當我們需要制作一個縱向分布等間距的布局時，可以使用 align-content:space-between；當我們需要制作一個響應式的布局時，可以在媒體查詢中更改 align-content 屬性來適配不同的屏幕尺寸。 總之，CSS 對齊方式 6 為我們提供了更多靈活性和可控性。在實際應用中，我們可以根據設計需求選擇對應的屬性值，讓我們的頁面呈現更加美觀、舒適的布局效果。