CSS3半透明遮蓋可以使網頁更加美觀，也可以實現一些特殊效果，比如將圖片變為灰色

/* 使用偽元素before實現半透明遮蓋 */
.demo {
position: relative;
}
.demo::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
/* 設置rgba顏色，在最后一位a（alpha通道）設置透明度，數值為0-1之間 */
}
/* 圖片灰色效果 */
.demo img {
filter: grayscale(100%);
/* 將圖片變為100%灰色 */
}

以上代碼可以實現一個半透明遮蓋和圖片灰色效果的例子。

另外，需要注意的是，半透明遮蓋的父元素需設置position屬性，使偽元素能夠繼承父元素的尺寸和位置。