CSS可以給圖片添加蒙版，讓圖片看起來更加美觀、獨特。下面介紹一下如何給圖片添加蒙版。

首先，需要確保圖片已經被添加到HTML文件中。可以通過img標簽添加圖片。

在CSS中，可以使用background-image屬性來添加圖片。利用:before偽元素，可以向圖片添加蒙版。

.image-container {
position: relative;
}
.image-container:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), 
url(image.jpg);
z-index: 1;
}

這里，.image-container是圖片的父元素，利用position:relative可以讓偽元素相對于父元素進行定位。

通過:before偽元素，添加了一個漸變蒙版和一張圖片為背景圖片。linear-gradient可以添加漸變效果，rgba表示Red、Green、Blue以及Alpha的縮寫。有兩個rgba參數，第一個參數表示蒙版的起始透明度，第二個參數表示蒙版的結束透明度。

最后，z-index屬性用于防止蒙版遮擋圖片。

通過這些簡單的CSS代碼，就可以給圖片添加蒙版。這樣，你的圖片可以得到更多的關注，吸引更多的眼球。