堅持'新！'最簡單也是最正確的方法。投資組合圖庫圖片上的圖標

Question

如何在使用CSS的投資組合中更多200x200圖片上貼上'新'圖標？我必須使用絕對位置嗎？如果是這樣，它在所有屏幕上看起來都不一樣？

然而，這就是我要找：

newicon http://gyazo.com/04cedd5d5c6bec5b00379415c983bbb9.png

你能看到的第一個圖像上的新的藍色圖標？這就是我需要的。 我需要一個關於如何將它完全粘貼的解釋，而不用圖像修剪它。

什麼是最好的方法？

Answer 1

是的，你需要設置其position到absolute - DEMO

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; 
}