怎么给css、js的图片加遮罩啊

怎么给css、js的图片加遮罩
怎么在图片上加图片啊
怎么给css、js的图片加遮罩啊

图片放在relative定位容器中，然后容器内放个absolute定位的div就行了，示例如下

img

<!doctype html>
<meta charset="utf-8" />
<style>
    .item{display:inline-block;position:relative;overflow:hidden}
    .item .mask{position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.6)}
    .item img{max-width:200px}
</style>
<div class="item">
    <img src="https://img9.doubanio.com/view/photo/m/public/p2356141664.webp" />
    <div class="mask"></div>
</div>
<div class="item">
    <img src="https://img9.doubanio.com/view/photo/m/public/p2356141664.webp" />
</div>

img

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡 【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632