-小小白-_ 2022-04-07 16:50 采纳率: 76.5%
浏览 49
已结题

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

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

  • 写回答

2条回答 默认 最新

  • CSDN专家-showbo 2022-04-07 16:52
    关注

    图片放在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

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 4月15日
  • 已采纳回答 4月7日
  • 创建了问题 4月7日

悬赏问题

  • ¥15 对于知识的学以致用的解释
  • ¥50 三种调度算法报错 有实例
  • ¥15 关于#python#的问题，请各位专家解答！
  • ¥200 询问：python实现大地主题正反算的程序设计，有偿
  • ¥15 smptlib使用465端口发送邮件失败
  • ¥200 总是报错，能帮助用python实现程序实现高斯正反算吗？有偿
  • ¥15 对于squad数据集的基于bert模型的微调
  • ¥15 为什么我运行这个网络会出现以下报错？CRNN神经网络
  • ¥20 steam下载游戏占用内存
  • ¥15 CST保存项目时失败