CSS :hover 与 <span> 元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/326396/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
:hover with <span> elements
提问by Coughlin
I am working with:
我正在与：
#top ul li.corner span.right-corner:hover
{
background-image:url("images/corner-right-over.gif");
width:4px;
height:15px;
float:left;
}
#top ul li.corner span.left-corner:hover
{
background-image:url("images/corner-left-over.gif");
float:left;
width:4px;
height:15px;
}
And I can't seem to get the :hoverworking properly? Not sure why, does anyone have any suggestions?
我似乎无法:hover正常工作？不知道为什么，有人有什么建议吗？
回答by defeated
I believe the problem is that SPAN elements display inline by default - meaning they have no height and width. Try explicitly making them block level elements by adding:
我认为问题在于 SPAN 元素默认显示内联 - 这意味着它们没有高度和宽度。尝试通过添加以下内容明确地使它们成为块级元素：
#top ul li.corner span.right-corner, #top ul li.corner span.left-corner
{
display: block;
}
回答by ZeeshanIqbal
Write <!DOCTYPE html>at the first line of your HTML document. Hover support should be enabled for all types of elements.
写<!DOCTYPE html>在 HTML 文档的第一行。应为所有类型的元素启用悬停支持。
回答by Claudio
As the commenter noted, "top" is not a valid selector. It should be "#top" or ".top"
正如评论者指出的那样，“top”不是有效的选择器。它应该是“#top”或“.top”
回答by Greg
Are you testing in IE? IE7 and below only support :hoveron <a>(not sure about IE8)
你是在 IE 中测试吗？IE7及以下仅支持:hover上<a>（不知道IE8）
