图片链接无法使用

Question

在我的网页我已经建立了一个图像链接/锚使用下面的代码：

<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

它可能有发生，因为覆盖你的链接body元素的。只是减少body元素的Z-index属性。

Answer 2

在没有看到页面的布局，很难找到修复。但是，你有几种可能性：

• 更改页面布局
• 从CSS样式删除z-index: -1
• 查找这是重叠图像的元素，并添加pointer-events: none到它的风采。然后，单击事件将通过图像。
• 变化元件的z-index该图像重叠，并给它较低的z索引值

Answer 3

我发现我的错误。如果它们被包含在一个div或块具有负的z-index图像链接变得无法响应。因此，而不是使之负面渲染默认之下。保持其容器中，在默认情况下，提高那些你希望它渲染背后的z-index的。