CSS彈性盒是目前比較流行的一種頁(yè)面布局方式，它可以使用簡(jiǎn)單明了的CSS代碼來(lái)實(shí)現(xiàn)各種布局需求。其中，彈性盒的居中布局特別方便，只需要幾行代碼就可以實(shí)現(xiàn)不同內(nèi)容的水平和垂直居中布局。

如下所示，是一個(gè)水平居中布局的示例代碼：

.container {
display: flex;
justify-content: center;
align-items: center;
}

上述代碼中，.container是彈性盒的容器，display:flex;將其設(shè)置為彈性盒布局。justify-content:center;表示在容器內(nèi)水平居中，align-items:center;表示在容器內(nèi)垂直居中。這樣，無(wú)論容器內(nèi)的內(nèi)容是什么，都可以實(shí)現(xiàn)水平和垂直居中布局。

如果想要實(shí)現(xiàn)內(nèi)容水平居中，但不垂直居中的情況，可以使用以下代碼：

.container {
display: flex;
justify-content: center;
}

上述代碼中，align-items默認(rèn)為stretch，即占滿整個(gè)容器，不居中。而通過(guò)設(shè)置justify-content為center來(lái)實(shí)現(xiàn)內(nèi)容在容器內(nèi)的水平居中。

如果想要實(shí)現(xiàn)內(nèi)容垂直居中，但不水平居中的情況，可以使用以下代碼：

.container {
display: flex;
align-items: center;
}

上述代碼中，justify-content默認(rèn)為flex-start，即在容器內(nèi)左對(duì)齊，而通過(guò)設(shè)置align-items為center來(lái)實(shí)現(xiàn)內(nèi)容在容器內(nèi)的垂直居中。

總之，CSS彈性盒的居中布局是比較靈活和實(shí)用的。無(wú)論在哪個(gè)場(chǎng)景下，都可以通過(guò)簡(jiǎn)單的CSS代碼快速實(shí)現(xiàn)水平和垂直居中布局。以上示例代碼僅供參考，大家可以根據(jù)具體需求進(jìn)行調(diào)整和擴(kuò)展，來(lái)實(shí)現(xiàn)更多的布局效果。