<div> 在 <a>

Question

我制作了一个简单的html片段，其中包含以下内容：

<a href="#"><div>Something here</div></a>

这显然提醒了我div不能在<a>标记中。我使用了一个div，因为我希望整个框（在本例中为div）是一个按钮。因此，子类:hover和一个适当的按钮区域适用于整个框，而不仅仅是其中的文本。据我记忆所及，div可以在html5的标签中使用。我使用XHTML 1.0 Transitional。有什么可以用来替换div以避免代码中的错误吗？还是应该将xhtml更改为html5？在不涉及其余代码的情况下，它能正常工作吗？非常感谢。

Answer 1

您可以使用display:block。

示例如下：

HTML:

<a href="#" class="btn"​​​​​​​​​​​​​​​​​​​​​>Button</a>​​​​​​​​​​​​​

CSS：

​a.btn{
    display: block;
    background-color: Green;
    width: 50px;
    height: 25px;
    text-align: center;
    text-decoration: none;
    color: White;
}
a.btn:hover{
    background-color: lightGreen;
    color: Black;
}

​您可以在这里进行现场测试：http://jsfiddle.net/YdCzY/

Answer 2

尝试使用这个：

HTML:

<a id="block-a" href="#">Something here</a>

CSS:

#block-a {
    display: block;
}

Answer 3

您可以尝试在'a'元素中使用'span'元素，而不是div。。。

您可以将样式应用于span，使其行为与您想要的div一样（例如，丰富的内容，它总体上也是一个链接）。

在AFAICS中，span和div之间的唯一区别是默认样式以及允许它们作为其子元素的元素。但我愿意被更有学识的贡献者纠正。。。

Answer 4

使用

<div onclick="..">...</div>

或a标签上的display: block;(http://green-beast.com/blog/?p=74)

Answer 5

至少更容易

`<div onclik="window.location.href='url'">
</div>`