小编典典

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


阅读 752

收藏
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