Question

我正在使用bootstrap，我需要在另一个上设置图像。这是我的图片：

<div class="span6" style="text-align: center">
    <img alt="" src="img/media/tv/originals.jpg" class="img-thumbnail" />
    <img alt="" src="img/media/tv/arrow.jpg" class="img-thumbnail" />
    <img alt="" src="img/media/tv/constantine.jpg" class="img-thumbnail" />
    <img alt="" src="img/media/tv/house-of-cards.jpg" class="img-thumbnail" />
    <img alt="" src="img/media/tv/originals.jpg" class="img-thumbnail" />
</div>

我需要在所有这些图像（如水印）上有一个图像（例如1.png），我不知道该怎么做。

Answer 1

这篇文章很有帮助！ using SVG or CSS to add a "watermark" or overlay to an image on a web page

HTML代码：

<div class='imageholder'>
    <img src='img/1.png' alt=''>
    <div class='watermark'>WATERMARK</div>
</div>

和CSS：

.imageholder{position:relative;}
.watermark
{
    position:absolute;
    bottom:0;
    background-color:rgba(0,0,0,.4);
}

好吧，我不需要那个bg颜色的CSS，所以删除它。如果你没有水印文字，最好将其删除！

将图像放在另一个图像上

1 个答案: