asp.net-mvc-3 - mvc3如何在图像的下部放置一个数字

Question

我被难住了，我正在尝试找到一种方法将用户 ID 号放在图像的左下角有没有办法可以做到这一点？为了说明这是我到目前为止所拥有的

foreach (var item in Model.profile)
{ 
 // user picture
 <img src="@Url.Content("~/uploads/profilepic" + item.photo)"   alt="" />
  // user id number
   @Html.ActionLink(@item.userID, "user", "profile",new { id = item.ProfileID })
    }

使用上面的代码，用户 ID 号出现在图像旁边，但我试图将它放在图像的左下角或右下角。我已经寻找了几个小时的解决方案，有人可以提供一些建议吗？谢谢

Answer 1

这可以使用 css 解决。首先将actionlink包装在一个div中。

foreach (var item in Model.profile)
{ 
  // user picture
  <img src="@Url.Content("~/uploads/profilepic" + item.photo)"   alt="" />
  // user id number
  <div class="imageLabel">
    @Html.ActionLink(@item.userID, "user", "profile",new { id = item.ProfileID })
  </div>
}   

然后是CSS：

.imageLabel {
  position: relative;
  top: -20px;
}

这将获取您的操作链接并将其移动到应该在图像上的初始位置上方 20 像素。