0

我有一个奇怪的问题。我制作了一个 div（下面将提供代码），我希望整个 div（因为它是一个按钮）成为一个可点击的链接。我遇到的问题是我的 div 应该只有 200x200，但想法水平延伸到整个页面。它应该只是那个 200x200 部分的链接，但就像我说的那样，它在页面的整个水平部分达到 200 的高度，使随机背景图像可点击。我尝试将 div 设置为阻止，但无济于事。我将如何解决这个问题？我的代码如下。

#button {
    display: block;
    background-color: black;
    opacity: 0.9;
    width: 200px;
    height: 200px;
    margin-top: 100px;
    margin-left: 100px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

<a href="signup.php"><div id="button"></div></a>
4

4 回答 4

2

使用display: inline-block;. 你也可以在根本没有的情况下做到这一点<div>。

http://jsfiddle.net/SLAfU/

于 2013-04-29T14:24:29.597 回答
1

你应该这样做：

#button {
    display: block;
    background-color: black;
    opacity: 0.9;
    width: 200px;
    height: 200px;
    margin-top: 100px;
    margin-left: 100px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

<a href="signup.php" id="button"></a>

由于锚点在 HTML 4.01 中不能包含块元素。因此，您可以将锚定为块元素，一切都会起作用。

在 HTML5 中，锚点可以包含块元素，因此设置display: block;或display: inline-block;组合<!DOCTYPE html>就足够了。

于 2013-04-29T14:24:41.763 回答
0

使锚标记“显示：内联块”

您需要有一个 HTML5 文档类型才能在锚标记中包含一个 div（块级元素）。

于 2013-04-29T14:24:47.827 回答
0

在这种情况下，正确的方法是：

<div id="button"><a href="signup.php"></a></div>

或者

<div id="button" onclick="document.location.href='signup.php'" style="text-decoration:underline"></div>

阅读 w3c 规范！你不能把块元素放在内联中！！！

于 2013-04-29T14:46:52.790 回答