CSS 中的蒙層可以用來實現許多有意思的效果，比如給圖片添加遮罩、實現鼠標懸浮時的效果等，下面將介紹如何使用 CSS 實現蒙層效果。

首先需要一個需要添加蒙層效果的元素，比如圖片。

<div class="wrapper">
<img src="picture.jpg" alt="picture">
</div>

添加 蒙層 的 CSS 樣式：

.wrapper {
position: relative; /* 定義容器為定位元素，使其子元素的絕對定位的基準 */
}
.wrapper::before {
content: ''; /* 偽元素必須加上 content 屬性才會顯示 */
position: absolute; /* 絕對定位，依據參考父元素 .wrapper 的位置 */
top: 0;
left: 0;
z-index: 1; /* 設置為 1，讓其位于圖片之上 */
width: 100%;
height: 100%;
background: rgba(0,0,0, 0.5); /* 設置蒙層顏色，a 表示透明度 */
}

在上述代碼中使用 ::before 偽元素，為元素添加蒙層，并通過設置 z-index 屬性將其置于圖片之上。

如果需要移除元素的蒙層，可以將類名 .wrapper 從元素中移除即可（或者將樣式設置為 display:none;），如下所示：

<div class="wrapper">
<img src="picture.jpg" alt="picture">
</div>
/* 移除元素的蒙層效果 */
.wrapper {
display: none;
}

以上是關于如何使用 CSS 實現蒙層效果的介紹。