先說(shuō)思路：
把圖片用做背景，然后寫(xiě)一個(gè)position:absolute;的div浮動(dòng)于它的上面，這個(gè)層設(shè)定一個(gè)半透明opacity:0.7;

css代碼

.left{position: absolute;z-index: 1;width: 191px;height: 301px;background-color: #335544;opacity: 0.6; } .right{position: absolute;z-index: 1;width: 191px;height: 301px;margin-left: 450px;background-color: #6D4550; opacity: 0.6; }

html代碼

<div class="pic"><div class="left"></div><div class="right"></div> </div>

效果如下

總結(jié)

以上是生活随笔為你收集整理的如何在图片上面装一个透明的遮罩层的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。