1

我不太确定处理这种情况的最佳方法。这是一个假设的情况：

<a href="/my-page/">
    <div style="width: 150px; height: 150px; background-image: url('images/myimage.jpg') 0 0 no-repeat; position: relative;">
        <div style="line-height: 50px; position: absolute; bottom: 0; left: 0;">
            <span>My Clickable Box</span>
        </div>
    </div>
</a>

所以在这种情况下，我有一个容器，另一个容器位于底部用于实际文本......但我需要整个框都是可点击的。

众所周知，当您将锚标记指定为特定的高度或宽度时，它的效果并不好……因此您几乎依赖于内部内容来执行此操作。

我不知道，我对这个有点茫然。

4

3 回答 3

4

如果您将其显示更改为block或inline-block您可以调整其大小，则无需使用我敢肯定在其中无效的 div。

<a style="display:inline-block;width: 150px; height: 150px; background-image: url('images/myimage.jpg') 0 0 no-repeat; position: relative;" href="/my-page/">
    <span>My Clickable Box</span>
</a>
于 2012-06-14T20:03:27.673 回答
0

您可以将需要可点击的 div 放置在锚标签内，并在 div 上设置大小。然后整个 div 将是可点击的，因为它位于链接内。

于 2012-06-14T20:00:51.360 回答
0

您可以像设置 div 一样设置锚点的样式，然后整个区域都是可点击的。例如

<a href="/my-page/" style="width: 150px; height: 150px; background-image: url('images/myimage.jpg') 0 0 no-repeat; position: relative; line-height: 50px; position: absolute; bottom: 0; left: 0;">My Clickable Box

于 2012-06-14T20:05:47.007 回答