< DIV>在< a> [英] <div> within <a>
问题描述
< a href =#> < div>此处的某个< / div>< / a>
它显然提醒我div不能位于< a>
标签。我使用了一个div,因为我希望整个盒子(在这种情况下,div)是一个按钮。因此,子类:hover
和适当的按钮区域适用于整个框,而不仅仅是内部文本。据我记得divs可以在html5标签中使用。我使用XHTML 1.0 Transitional。有什么我可以代替div来避免代码中的错误?或者我应该将xhtml更改为html5?它会在没有触及代码的其余部分的情况下工作吗?谢谢。
您可以使用 display:block
p>
一个例子如下:
HTML:
< a href =#class =btn>按钮< / a> ;
CSS:
a.btn {
display:block;
background-color:Green;
width:50px;
height:25px;
text-align:center;
text-decoration:none;
颜色:白色;
}
a.btn:hover {
background-color:lightGreen;
颜色:黑色;
code $
$ b你可以在这里测试它: http://jsfiddle.net/YdCzY/
I have made a simple fragment of html, which contains this:
<a href="#"><div>Something here</div></a>
It obviously alert me that div cannot be inside an <a>
tag. I have used a div, because I want the whole box (div in this case) to be a button. So the subclass :hover
and a proper button area applies to the whole box, not only a text inside. As far as I remember divs can be used inside tags in html5. I use XHTML 1.0 Transitional. Is there anything I can replace a div with to avoid errors in the code? or should I change xhtml to html5? will it work good without touching the rest of the code? thank you.
解决方案 You could use display:block
.
An example is as follows:
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;
}
You can test it live here: http://jsfiddle.net/YdCzY/
这篇关于< DIV>在< a>的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!