在我上面的小提琴中,我的鼠标光标在按钮的右侧和左侧获得了水平的不明超链接,我不知道为什么。
<a href="newgame.html"><div class="startnewgame">START NEW GAME</div></a>
在我上面的小提琴中,我的鼠标光标在按钮的右侧和左侧获得了水平的不明超链接,我不知道为什么。
<a href="newgame.html"><div class="startnewgame">START NEW GAME</div></a>
根据 W3C 标准,你不应该把标签放在div
里面。a
正确的做法是,
<div><a href="newgame.html" class="startnewgame">START NEW GAME</a></div>
查看您的演示,http://jsfiddle.net/fqnGT/2/
不允许div
在锚标记中使用 a。改用span
- http://jsfiddle.net/fqnGT/1/
更新:
设置display: inline-block
嵌套跨度 - http://jsfiddle.net/fqnGT/8/
最简单的方法
编辑
<a href="newgame.html" class="startnewgame">START NEW GAME</a>
将类添加到您的链接:
<a href="newgame.html" class="link">
添加这个:
a.link{
display: block;
float: left;
margin-left:100px;
}
并编辑:
.startnewgame {
width: 298px;
padding: 20px;
color: white;
background: blue;
font-family: Arial;
font-size: 32px;
font-weight: 900;
}
在startnewgame
样式类上覆盖display
display: inherit
编辑:(在带有 div 的原始来源上)
您可以稍微更改标记和 css:
<div class="startnewgame">
<a href="newgame.html">START NEW GAME</a>
</div>
.startnewgame {
width: 298px;
padding: 20px;
margin-left: 100px;
background: blue;
font-family: Arial;
font-size: 32px;
font-weight: 900;
}
.startnewgame a {
color: white;
}
.startnewgame a:hover {
cursor: pointer;
color: yellow;
}