<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<script src="/Scripts/jquery-1.10.2.js"></script>
<style type="text/css">
.imgDiv {
display: inline-block;
position: relative;
}
.imgDiv .delete {
position: absolute;
top: 0px;
right: 0px;
50px;
height: 50px;
display: none;
}
</style>
</head>
<body>
<script type="text/javascript">
$(document).ready(init);
function init() {
$(".imgDiv").mouseenter(function () {
$(this).find(".delete").show();
});
$(".imgDiv").mouseleave(function () {
$(this).find(".delete").hide();
});
}
</script>
<div class="imgDiv">
<img src="http://img.acgbz.com/Download/892/images/52321860_p0.jpg" />
<a href="#">
<img src="http://www.iconpng.com/png/sm-reflection-r/button-cross.png" class="delete" />
</a>
</div>
</body>
</html>
各位复制运行即可。
可以看到，这里采用的是css的position 的属性，absolute属性大家请查询 http://www.w3school.com.cn/cssref/pr_class_position.asp 的详细介绍，
布局方面想深入理解则可以点击此网站：http://zh.learnlayout.com/position.html
回到正题，这里使用absolute是因为右上角交叉图针对的是它的主图，而absolute则恰巧是针对它
因为：它不是相对于视窗而是相对于最近的“positioned”祖先元素