css - 如何将图像放在另一个图像上？

Question

如何将一张图片放在另一张更大的图片上，比如在 youtube 上，播放按钮显示在视频缩略图的顶部？

Answer 1

制作一个带有“播放”符号和所需大小(例如 240x320)的半透明 PNG 图形。

假设您将其命名为“overlay.png”，并且假设 YouTube 生成的缩略图位于 http://img.ytimg.com/abcdefg/0.jpg。

现在您的代码中只需要这样:

<a href="destination_of_your_link">
    <img src="overlay.png" width="320" height="240" border="0"
         style="background: url(http://img.ytimg.com/abcdefg/0.jpg) center center black;" />
</a>

只要您的目标受众没有仍在使用 IE6，您应该是安全的。