css - 「New!」にこだわる最も簡単で正しい方法 ポートフォリオ ギャラリーの画像のアイコン

Question

CSS を使用してポートフォリオの 200x200 以上の画像に「新規」アイコンを貼り付けるにはどうすればよいですか? 絶対位置を使用する必要がありますか? もしそうなら、それはすべての画面で同じように見えませんか?

ただし、これは私が探しているものです:

_{（出典：gyazo.com）}

最初の画像の新しい青いアイコンが見えますか? それだけが必要。画像でトリミングせずに、このように貼り付ける方法について説明が必要です。

最善の方法は何ですか？

Answer 1

はい、次のように設定positionする必要があります-DEMOabsolute

HTML

<div class="imageholder">
  <img src="http://lorempixel.com/200/200" />
  <img src="http://placehold.it/40x40&text=NEW" class="new" />
</div>

CSS

.imageholder {
  position: relative;
}

.new {
  position: absolute;
  left: 30px;
  top: 0;
}