以下是我的HTML代码：
<div id="fh5co-blog-section">
<div class="container">
<div class="seller">
<img src="assets/img/contact.jpg" class="img-responsive">
</div>
<h1 class="text-center">Contact Us</h1>
<p>Get in touch with us for any additional queries, suggestions or feedback regarding any product.</a></p>
</div>
</div>
我想要实现的是，我想在链接的图像上添加一个覆盖层，也希望在覆盖层上显示文本。但是以某种方式我无法实现它，我的代码每次都在混乱。我还搜索了许多有关stackoverflow的站点和答案，但是我无法找到确切的解决方案。谁能帮我这个忙。提前致谢。
最佳答案
对于叠加层，您可以将其插入div（此div必须具有position：relative）并设置其CSS：
position: absolute; top:0; left:0; right:0; bottom:0; background: rgba(0,0,0,0.3);。之后，将图像和文本放入该div中。
我的例子：http://codepen.io/anon/pen/qrmQgo