在 CSS 中實現(xiàn)水平垂直居中是常見的布局需求。

首先，讓我們看一下如何使用flexbox來實現(xiàn)水平垂直居中。

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

父元素需要設置display: flex，并使用justify-content: center和align-items: center屬性使其子元素水平垂直居中。

另外，我們也可以使用position屬性以及transform屬性來實現(xiàn)水平垂直居中。

.parent {
position: relative;
}
.child {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

其中，父元素需要設置相對定位，子元素需要設置絕對定位，并使用top和left屬性將子元素移動到父元素的中心點。最后，使用transform: translate(-50%, -50%)屬性來調整子元素的位置，使其水平垂直居中。

以上是兩種實現(xiàn)水平垂直居中的方式，根據(jù)實際需求選擇合適的方式即可。