CSS是一種非常有用的前端技術(shù)，可以用來(lái)美化網(wǎng)頁(yè)。其中一個(gè)常見(jiàn)的用途是設(shè)置背景圖片。有時(shí)候，我們需要讓背景圖片被一個(gè)圖層掩蓋，以達(dá)到一種遮罩的效果。這里就介紹一下CSS背景掩蓋圖片的方法。

body {
background-image: url("background.jpg");
background-size: cover;
}
.overlay {
background-color: rgba(0, 0, 0, 0.5);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

首先，在body標(biāo)簽中設(shè)置背景圖片，使其占滿(mǎn)整個(gè)頁(yè)面。這里還設(shè)置了background-size為cover，使圖片鋪滿(mǎn)整個(gè)頁(yè)面。接著，我們創(chuàng)建一個(gè)遮罩圖層。它的類(lèi)名為overlay，樣式包括設(shè)置背景色為半透明黑色（rgba(0, 0, 0, 0.5)），寬度和高度都為100%，并且利用絕對(duì)定位讓它覆蓋整個(gè)頁(yè)面。

這樣一來(lái)，就可以實(shí)現(xiàn)CSS背景掩蓋圖片的效果。細(xì)節(jié)可以根據(jù)具體情況進(jìn)行調(diào)整，比如改變遮罩圖層的透明度、顏色等。這種技術(shù)在實(shí)現(xiàn)一些特殊效果時(shí)非常實(shí)用，例如登錄框、彈窗等。