css为图片添加一层蒙版并在上层显示文字等

效果图：

代码如下：

<div class="row" style="width:100%; position:relative;z-index:1;margin:0 auto; background: #000;">
    <img src="~/images/touxiang.jpg" style="width:100%; opacity:0.6; filter: alpha(opacity=60);"/>
    <div style="width:100%;position:absolute;z-index:2;top:50%; text-align:center;">
        <h2 style="color:#fff">文字浮动在图片上方</h2>
    </div>
</div>

 

posted @ 2019-10-28 11:25  代码沉思者  阅读(6090)  评论(0)  编辑  收藏  举报