为了让同伴的答案在ie7及以后的版本中工作，它需要做一些调整。

如果元素没有背景色，IE将不支持z-index，因此链接将不会与包含内容的div的部分重叠，只与空白部分重叠。为了解决这个问题，添加了一个不透明度为0的背景。 由于某种原因，当在链接方法中使用span时，IE7和各种兼容模式完全失败。然而，如果链接本身被赋予了样式，它就可以正常工作。

.blockLink  
{  
    position:absolute;  
    top:0;  
    left: 0;  
    width:100%;  
    height:100%;  
    z-index: 1;  
    background-color:#ffffff;   
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
    filter: alpha(opacity=0);  
    opacity:0;  
}

<div style="position:relative">  
    <some content>  
    <a href="somepage" class="blockLink" />  
<div>

将你的div包含在一个锚标记<a href></a>中:

    <a href="">
      <div>anything goes here will turn into a link</div>
    </a>

如果你可以使用bootstrap，一个简单的解决方案是使用bootstrap .stretch -link。

https://getbootstrap.com/docs/4.3/utilities/stretched-link/

示例代码

<div class="card" style="width: 18rem;">
  <img src="..." class="card-img-top" alt="...">
  <div class="card-body">
    <h5 class="card-title">Card with stretched link</h5>
    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
    <a href="#" class="btn btn-primary stretched-link">Go somewhere</a>
  </div>
</div>

这是实现你想要的东西的“有效”解决方案。

<style type="text/css">
.myspan {
    display: block;
}
</style>
<a href="#"><span class="myspan">text</span></a>

但最可能的是，您真正想要的是将<a>标记显示为块级元素。

我不建议使用JavaScript来模拟超链接，因为这违背了标记验证的目的，标记验证的最终目的是提高可访问性(按照适当的语义规则发布格式良好的文档可以最大限度地减少不同浏览器对同一文档的不同解释)。

最好是发布一个不需要验证，但在所有浏览器(包括禁用JavaScript的浏览器)上都能正常渲染和运行的网页。此外，使用onclick不会为屏幕阅读器提供语义信息，以确定div是作为链接使用的。

需要一点javascript。 但是，你的div是可点击的。

<div onclick="location.href='http://www.example.com';" style="cursor:pointer;"></div>

实际上你现在需要包括JavaScript代码， 请查看本教程。

但有一个棘手的方法来实现这个使用CSS代码 你必须在你的div标签内嵌套一个锚标签，你必须应用这个属性，

display:block;

当你这样做了，它将使整个宽度区域可点击(但在锚标签的高度内)，如果你想覆盖整个div区域，你必须将锚标签的高度设置为div标签的高度，例如:

height:60px;

这将使整个区域可点击，然后你可以应用text-indent:-9999px到锚标签来实现目标。

这是非常棘手和简单的，它只是用CSS代码创建的。

这里有一个例子:http://jsfiddle.net/hbirjand/RG8wW/