在網頁的布局中，常常需要將某個元素垂直居中。而在CSS中，實現背景垂直居中的方法有多種，但其中比較推薦的一種是使用偽元素。

首先，在CSS中，我們可以使用position屬性來控制元素的定位方式。而這里，我們需要使用絕對定位的方式來實現居中。因此，需要為目標元素的父元素設置一個相對定位的position屬性。以實現目標元素基于父元素的定位。

.parent {
position: relative;
}
.target {
position: absolute;
top: 50%;
}

然而，此時可能會發現目標元素垂直居中的位置偏向上方。這是由于元素的實際高度被計算在內，導致元素向上移動一半的高度。因此，需要在CSS中修改元素的計算方式。

.parent {
position: relative;
}
.target {
position: absolute;
top: 50%;
transform: translateY(-50%);
}

上述代碼中的transform屬性用于實現元素的垂直居中。 而在設置背景圖片時，我們可以使用CSS的background-size屬性和background-position屬性來控制圖片的大小和位置。使用這兩個屬性，可以方便地調整圖片的大小和位置，以實現背景圖片的垂直居中。

.parent {
position: relative;
background-image: url('background.jpg');
background-size: contain;
background-position: center;
}
.target {
position: absolute;
top: 50%;
transform: translateY(-50%);
}

代碼中的background-size屬性用于控制圖片的大小，而background-position屬性則用于調整圖片的位置。將background-position設為center，即可使圖片水平和垂直方向均居中。

以上就是使用CSS實現背景垂直居中的方法。通過偽元素實現垂直居中，同時使用background-size和background-position屬性可以方便地控制背景圖片的大小和位置。