触摸图片加蒙版是网页设计中常用的一种效果，它可以让用户在鼠标移动到图片上时，图片的颜色变暗或者显示出相应的提示信息。通过CSS可以轻松实现这种效果。

img {
position:relative;
}
img:hover:after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
z-index: 1;
}

上述代码中，我们首先对图片设置了相对定位，这是为了让蒙版绝对定位时相对于图片进行位置参照。接着，在图片的:hover状态下，设置了一个after伪元素，这个元素的content值为空，display值为block，让它以块级元素的方式呈现出来。设置position为absolute，top和left值为0，width和height值为100%时，这个伪元素就会完全覆盖住图片。接下来，我们设置了背景色为rgba(0,0,0,0.5)，这里的rgba就是利用了CSS3的颜色设置功能，设置背景色为半透明黑色，使得蒙版产生一种半透明的效果。最后我们将z-index值设为1，这是为了保证蒙版始终在图片上面。

除了上述方法外，我们还可以使用:before伪元素或者实际的html元素来实现蒙版效果。这里的关键就是利用了CSS伪元素和层级关系的特性，让鼠标悬浮在图片上时，出现遮罩层，从而达到简单而有效的效果。