在進行頁面布局中，經(jīng)常會出現(xiàn)需要將某個元素居中顯示的情況，這時候就需要用到CSS的居中布局。

橫向居中的方法如下：

.parent {
display: flex;
justify-content: center; /* 橫向居中 */
}

首先將父元素的display屬性設(shè)為flex，然后使用justify-content屬性設(shè)置子元素水平居中?？梢钥吹剑浅：唵螌嵱?！

縱向居中的方法如下：

.parent {
position: relative;
}
.child {
position: absolute;
top: 50%;
transform: translateY(-50%); /* 縱向居中 */
}

首先將父元素設(shè)置為相對定位，然后將子元素設(shè)置為絕對定位，再使用top屬性將子元素向下移動到居中位置，transform屬性的translateY(-50%)作用是將子元素往上移動50%自身高度，即實現(xiàn)垂直居中的效果。

以上就是CSS橫向和縱向居中的方法。掌握了這些方法，我們就能輕松實現(xiàn)各種居中布局。