css实现图片遮罩高亮效果

本文主要是介绍css实现图片遮罩高亮效果，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

html代码

<div class="img-box"><img src="img/aaa.jpg" class="img"/><p class="load" style="display: none;"></p></div>

css代码

* {font-family: Arial "微软雅黑";margin:0;padding:0;}.img-box{position: relative;width:200px;margin-bottom: 20px;}.img-box p{position: absolute;left: 0;top: 0;right: 0;line-height: 133PX;height: 133PX;text-align: center;color: #fff;background-color: rgba(0,0,0,.5);}.img{width:100%;display: block;}

重点是设置p标签的背景颜色  第一张图片是黑色带透明度的背景色，第二张图片是白色带透明度的背景色，第三张图片是原图

这篇关于css实现图片遮罩高亮效果的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---