在CSS中，水平軸布局是一種非常重要的布局方式。水平軸布局可以讓我們更好地組織頁面，使得頁面具有更好的可讀性和可用性。下面我們就來了解一下如何使用CSS實(shí)現(xiàn)水平軸布局。

.container {
display: flex;   /*使用flex布局*/
justify-content: space-between;   /*使flex項(xiàng)目分布在父元素中*/
align-items: center;   /*讓flex項(xiàng)目居中對(duì)齊*/
}
.item {
flex: 1;   /*讓flex項(xiàng)目自適應(yīng)大小*/
text-align: center; /*讓文本水平居中*/
}

CSS3中的flex布局給予了我們非常大的自由度和靈活性。我們可以使用flex屬性來定義父元素的Flex容器。接著，我們可以使用justify-content屬性來分布父元素中的Flex項(xiàng)目。最后，我們可以使用align-items屬性來讓Flex項(xiàng)目居中對(duì)齊。

除了以上的Flex屬性，我們還可以通過設(shè)置item的flex屬性來讓他們自適應(yīng)大小，使用text-align屬性來讓文本內(nèi)容水平居中。這樣，我們最終實(shí)現(xiàn)了一個(gè)簡(jiǎn)單而美觀的水平軸布局。