移动图像后,HTML + CSS图像链接无效

时间:2016-08-04 16:32:36

标签: html css image hyperlink position

基本上我想在我的名字下放置我的图像(在我的网站中位于屏幕中间)当我移动图像时,链接不再有效,我可以向左或向右移动我想要的它的工作原理!但上下,它不再有效?

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;
}

2 个答案:

答案 0 :(得分:0)

我刚刚得到它:并不是图像没有出现;这不是一个链接。

你想要这个:

<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>

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

答案 1 :(得分:0)

修正: 我通过添加:

来修复它
    z-index: 1;

到我的css部分图片/链接

所以在它之前

    .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;
}

希望这有助于他人! 感谢那些试图帮助的人!