在网站开发中，经常需要在图片上添加水印，来保护图片资源不被盗用。使用CSS可以很方便地为图片添加水印，下面我们就来看看如何实现吧。

.watermark {
position: relative;
display: inline-block;
}
.watermark::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: url("watermark.png");
opacity: 0.5;
}

首先我们为图片设置一个position属性值为relative的父级元素，以便于后续操作。接下来使用CSS的伪元素::after来为父级元素添加水印。使用content属性来插入空内容来创建伪元素。使用position: absolute设置水印的绝对定位，top和left属性值为50%，让水印居中显示。使用transform属性调整水印的位置，translate的-50%让水印水平和垂直居中。background属性设置水印图片的地址，使用opacity属性设置水印透明度，使其不会影响原图显示效果。最后将上述样式应用到父级元素。这样我们就完成了使用CSS为图片添加水印的操作，是不是很简单？