3

Web ページに表示されている画像に CSS または SVG オーバーレイまたは透かしを追加するにはどうすればよいですか? 表示しているサムネイルのグリッドがあり、それらのいくつかを特別なメモや言葉で強調したいと考えています。

HTML 5 と CSS3 に対応していますが、適切に分解する必要があります。JQueryも受け入れられます。

4

1 に答える 1

2

あなたが何を求めているのか理解できれば、このようにすることができます。

次の HTML マークアップがあるとします。

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

その .watermark div に配置したものはすべて、画像の下部に表示され、その上に重ねられます。

あなたのCSSはこのようになります

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

背景色にアルファを使用すると、ユーザーはそれを部分的に見ることができますが、それでもテキストを読むことができます。

于 2013-07-19T13:42:05.233 に答える