CSS中的圖片透明度可以通過opacity屬性、RGBA顏色值以及background-color實(shí)現(xiàn)。

/* 通過opacity調(diào)整圖片透明度 */
img {
opacity: 0.5; /* 不透明度為50% */
}
/* 通過RGBA顏色值調(diào)整背景顏色的透明度 */
.container {
background-color: rgba(0, 0, 0, 0.5); /* 背景顏色為黑色，不透明度為50% */
}
/* 通過background-color實(shí)現(xiàn)圖片加透明色 */
.mask {
background-color: rgba(0, 0, 0, 0.5); /* 透明色的不透明度為50% */
padding: 10px; /* 可以為透明色增加一定的空白區(qū)域 */
}
.mask img {
position: relative; /* 相對(duì)定位 */
z-index: 1; /* 值越大，越在前面 */
}
.mask:before {
content: '';
display: block;
position: absolute; /* 絕對(duì)定位 */
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.5); /* 透明色 */
z-index: 2; /* 在圖片前面 */
}

以上代碼中，最后一個(gè)例子可以實(shí)現(xiàn)一個(gè)透明色的遮罩層覆蓋在圖片上面。通過before偽元素和絕對(duì)定位的方式創(chuàng)建一個(gè)透明色層，并設(shè)置為圖片的前面。這樣就可以達(dá)到透明色覆蓋在圖片上面的效果。