jquery - 如何在图片右上角显示删除按钮？

Question

我想在图像的右上角显示删除按钮吗？ 我怎样才能做到这一点？

我的 html 是这样的:-

主图:

<img id="' + id + '" src="../Images/DefaultPhotoMale.png" class="' + item + '" width="40" height="40" alt="image" title="' + projectTitle + '" style="cursor:pointer" />

x 按钮图像显示在上图的右上角

• '<img id="' + item.Soid + '" src="../Images/RemoveButton.ico" style="display:none" title="Remove Specialization" />

请不要设置背景图片，我需要那个删除按钮的点击事件 像这样:

Answer 1

position: relative 和 position: absolute 的常用方法。

HTML:

<div class="img-wrap">
    <span class="close">&times;</span>
    <img src="http://lorempixel.com/100/80">
</div>

CSS:

.img-wrap {
    position: relative;
    ...
}
.img-wrap .close {
    position: absolute;
    top: 2px;
    right: 2px;
    z-index: 100;
    ...
}

扩展演示(+JS交互)http://jsfiddle.net/yHNEv/