图片 Link 不工作

Question

在我的网页中，我使用以下代码设置了图像 link/anchor：

<div class="bg_1">
        <div class="Absolute-Center">
            <span style="font-size: 50px; color: aqua">in short.</span><br />
            LIVE LIFE AT YOUR OWN PACE.<br /><br /><br /><br /><br /><br /><br />
            <a href="#home1"><img src="images/scrolldown.png" width="50" height="50" border="0" /></a>
        </div>
    </div>
    <div style="height: 100vh; background-color: black;" >
        <a name="home1"></a>
    </div>

然而，当我运行我的页面时，此图像似乎不可点击，也不会在您点击时带您到任何地方。有任何想法吗？如果它有什么不同，我使用的图像大部分是透明的。
编辑：
我已将问题缩小为由 z-index 引起。 "bg__1"的CSS代码如下：

.bg_1 {
    height: 100vh;
    position: relative;
    z-index: -1;
    background-position: center center;
    background-size: cover;
    background-image: url(http://31.media.tumblr.com/2c3a72acc53b1a78ef3b6c4986604cd2/tumblr_ni0jt8sKlY1sr6759o1_500.gif);
}

删除 z-index 行可以解决问题，但是我的布局需要 z-index。

Answer 1

如果看不到页面布局，就很难找到修复方法。但是，您的可能性很小：

更改页面布局
从 css 样式中删除 z-index: -1
找到与您的图片重叠的元素，然后将 pointer-events: none 添加到它的样式中。然后，点击事件将传递给图像。
更改 z-index 与图像重叠的元素，并为其赋予较低的 z-index 值

Answer 2

我发现了我的错误。如果图像链接包含在 div 或具有负 z-index 的块中，它们将变得无响应。因此，不要让渲染低于默认值变得消极。保持其容器为默认值，并提高您希望它在后面呈现的容器的 z-index。

Answer 3

这可能是因为 body 元素覆盖了您的 link。只需减少 body 元素的 z-index 属性。

图片 Link 不工作

Image Link Not Working

html

css

image

hyperlink