图片超链接在 html 中不起作用

Question

侧边栏上指向其他页面的常规链接有效，但是当我尝试超链接页面 body 中的图像时，没有任何反应。一切都在同一个目录中。这与具有 header div 和带有 "display:fixed" 和 "z-index:1" 侧边栏的页面有什么关系吗？

#info {
  display: inline-block;
  vertical-align: top;
  width: 80%;
  height: auto;
  padding: 0em 1em 0em 1em;
  position: absolute;
  margin-top: 15em;
  margin-left: 12em;
  z-index: -1;
}
#info td {
  display: inline-block;
  padding: 0em 2em 0em 2em;
}
#info img {
  height: 15em;
  width: auto;
}
#link_title {
  font-weight: bold;
  font-size: 20px;
  text-align: center;
}

<div id="info">
  <h2> Tips & Tricks </h2>
  <table>
    <td>
      <p id="link_title">Cooking & Food Tips</p>
      <a href="tips_tricks_cooking.html">
        <img src="deceuillete_fraise.jpg" alt="strawberry" />
      </a>
    </td>

Answer 1

您的图片 link 位于 div 内，z-index 为负 - 因此无法点击。您需要从 #info.

中删除负 z-index

Answer 2

删除 #info 中的 z-index:-1 对您来说效果很好

Answer 3

z-index 告诉浏览器 html 代码中图层的偏好。删除 z-index 或将其放在 'stack order' 中较低的位置，它应该可以正常工作。另外，仅供参考，您的 table 缺少标签。

display:fixed 不会影响其他标签，除非此部分（粘贴在上面）在这些标签内，否则会导致冲突和错误

图片超链接在 html 中不起作用

image hyperlink not working in html

html

image

hyperlink