HTML + CSS 图像 link 移动图像后将不起作用

Question

基本上我想把我的图片放在我的名字下面（在我的网站上，它在屏幕中间）当我向下移动图像时 link 不再有效，我可以将它向左移动或者尽我所能，它有效！但是上下，它不再起作用了？

HTML:

<a href="http://steamcommunity.com/id/clarkycalLad/" target="_blank">
  <div class="imgtest">
    <img src="/images/steam-icon.png" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
  </div>
</a>

CSS:

.imgtest {
  position: relative;
  left: 800px;
  top: 100px;
  border: 3px solid #73AD21;
}

Answer 1

我才明白：不是图片不显示，而是图片不显示。就是它不是 link.

你想要这个：

<div class="imgtest">
  <a href="http://steamcommunity.com/id/clarkycalLad/" target="_blank">
    <img src="/images/steam-icon.png" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
  </a>
</div>

否则你移动的是图像而不是锚点。

Answer 2

修正：我通过添加修复它：

    z-index: 1;

我的 css 部分 image/Link

所以之前

    .imgtest {
  position: relative;
  left: 800px;
  top: 100px;
  border: 3px solid #73AD21;
}

现在是：

.imgtest {
    position: relative;
    left: 800px;
    top: 100px;
    border: 3px solid #73AD21;
    z-index: 1;
}

希望这对其他人有帮助！感谢那些试图提供帮助的人！

HTML + CSS 图像 link 移动图像后将不起作用

HTML + CSS Image link won't work after moving the image

html

css

position

image

hyperlink