我听说把块级元素放在内联元素里是HTML的大忌：
<a href="http://example.com">
<div>
What we have here is a problem.
You see, an anchor element is an inline element,
and the div element is a block level element.
</div>
</a>
如果在样式表中将外部锚点样式设置为display:block，会怎么样呢？这样做仍然有问题吗？ HTML 4.01规范关于块级元素和内联元素似乎是这样认为的：
样式表提供了指定任意元素呈现方式的手段，包括元素是作为块级元素还是内联元素呈现。在某些情况下，例如为列表元素设置内联样式，这可能是适当的，但一般来说，作者不应该以这种方式覆盖HTML元素的传统解释。
是否有人对此问题有进一步的建议？
a:before{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
pointer-events: auto;
content: "";
background-color: rgba(0,0,0,0);
}<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet"/>
<div class="card" style="width: 18rem;">
<img src="https://via.placeholder.com/250" 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><a> 块，为什么不把 <a> 放在 div 里面呢？作为块级元素，它会给你同样的效果。我认为当人们问这个问题时，大多数情况下是因为他们只用div构建了一个网站，现在其中一个div需要成为一个链接。
我曾经看到有人使用透明的空白图片（PNG）放在锚点标签内，只是为了在div内创建一个链接，而且这个图片的大小与div相同。
其实这很可悲...但它确实有效...
这是错误的。请使用span。
仅供参考。
如果您的目标是使您的 div 具有可点击性，您可以使用 jQuery / Java Script。
定义您的 div 如下：
<div class="clickableDiv" style="cursor:pointer">
This is my div. Try clicking it!
</div>
然后您的jQuery将被实现如下：
<script type="text/javascript">
$(document).ready(function () {
$("div.clickableDiv").click(function () {
alert("Peekaboo");
});
});
</script>
这也适用于多个div - 如Tom在此线程中的评论所述