Question

我有一个特殊的问题。我已经创建了一个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>

Answer 1

使用display: inline-block;。您也可以在没有<div>的情况下执行此操作。

http://jsfiddle.net/SLAfU/

Answer 2

你应该按照以下方式进行：

#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>结合使用就足够了。

Answer 3

制作锚标签“display：inline-block”

您需要拥有HTML5文档类型才能在锚标记内部使用div（块级元素）。

Answer 4

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

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

或

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

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

一个A属性内的Div不起作用？

4 个答案: