HTML/CSS中整个div的href链接
以下是我试图在HTML/CSS中实现的内容：
我有不同高度和宽度的图像，但它们都在180x235以下。所以我要做的就是用border创建一个div，然后对它们进行vertical-align: middle。我已经成功地做到了这一点，但现在我被困在如何正确地链接整个div的href上。
下面是我的代码：
<div id="parentdivimage" style="position:relative;width:184px;height:235px;border-width:2px;border-color:black;border-style:solid;text-align:center;">
<div id="childdivimage" style="position:absolute;top:50%;height:62px;margin-top:-31px;">
<img src="myimage.jpg" height="62" width="180">
</div>
</div>
请注意，为了便于在这里复制粘贴，样式代码是内联的。
我在某处读到，我可以简单地在代码之上添加另一个父div，然后在其中执行href。然而，根据一些研究，它不会是有效的代码。
因此，再次总结一下，我需要整个div (#parentdivimage)是一个href链接。
回答 8
Stack Overflow用户
发布于 2011-10-27 05:02:04
如下所示：
Parentdivimage应指定宽度和高度，其位置应为：
position: relative;就在parentdivimage里面，在parent包含的其他div旁边，你应该放：
<a href="linkt.to.smthn.com"><span class="clickable"></span></a>然后在css文件中：
.clickable {
height: 100%;
width: 100%;
left: 0;
top: 0;
position: absolute;
z-index: 1;
}span标记将填充它的父块parentdiv，因为高度和宽度都设置为100%。Span将位于所有周围元素的顶部，因为将z-index设置为高于其他元素。最后，span将是可点击的，因为它位于'a‘标签内。
Stack Overflow用户
发布于 2015-08-14 07:09:31
根据Surreal Dreams的说法，根据我的经验，最好是设计锚标签的样式，但这真的取决于你在做什么。下面是一个例子：
Html：
<div class="parent-div">
<a href="#">Test</a>
<a href="#">Test</a>
<a href="#">Test</a>
</div>然后是CSS：
.parent-div {
width: 200px;
}
a {
display:block;
background-color: #ccc;
color: #000;
text-decoration:none;
padding:10px;
margin-bottom:1px;
}
a:hover {
background-color: #ddd;
}Stack Overflow用户
发布于 2010-12-17 06:26:18
将id="childdivimag"的div改为span，并将其包装在a元素中。因为span和img是内联元素，所以缺省情况下它仍然有效，而div是块级元素，因此当包含在a中时，标记无效。
https://stackoverflow.com/questions/4465923
复制相似问题