HTML / CSS中整个div的href链接

小编典典

HTML / CSS中整个div的href链接

html

这是我要在HTML / CSS中完成的工作：

我有不同高度和宽度的图像，但是它们都在180x235以下。所以我要做的是创建一个divwith border及其vertical-align: middle所有。我已经成功地做到了这一点，但是现在我仍然停留在如何正确地href链接整个链接的问题上div。

这是我的代码：

<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链接。

阅读 745

2020-05-10

共1个答案

小编典典

在HTML5中，在div中使用div在语义上是正确的。

您需要在以下情况之间进行选择：

<a href="http://google.com">
    <div>
        Hello world
    </div>
</a>

从语义上讲这是不正确的，但是它将起作用。

<div style="cursor: pointer;" onclick="window.location='http://google.com';">
    Hello world
</div>

从语义上讲这是正确的，但是涉及使用JS。

<a href="http://google.com">
    <span style="display: block;">
        Hello world
    </span>
</a>

在语义上是正确的，可以按预期工作，但不再是div。

2020-05-10