背景链接（在所有背景！）

Question

  

可能重复：
  How to make a whole 'div' clickable in html and css without javascript?

我已经设置了一个100％的宽度/高度div来保留在网站的背景上，如下所示：

.background {
    background-color:rgba(50,50,50,0.4);
    width:100%;
    height:100%;
    position:absolute;
    z-index:-1;
}

我希望有一个覆盖WHOLE div的链接，但是如果我编写类似这样的代码，我会将链接显示在div的最后一部分（请记住，这个div必须保留在背景中，在它上面有一些div），在其他div之后，保持在它之上。

<a href='/home'>
     <div class='background'></div>
</a>

有没有HTML / CSS解决方案？

Answer 1

您无法在<div>个代码中嵌套<a>个代码。但是，您可以使用CSS <a>属性使<div>表现得像display:block。

<强> CSS

*, html, body {
    width: 100%;
    height: 100%;
}

.background {
    display: block;
}

<强> HTML

<a href="#" class="background"></a>​

JS Fiddle