CSS 相邻同级选择器 - IE8 问题
我正在使用 UL/LI 结构创建一个菜单系统。我正在尝试使用同级选择器进行悬停/显示子菜单。
我正在用这个;
#MainMenu li.Sel ul li.HasSub a:hover+ul {
display: block;
}
UL 结构大概是这样的;
<ul id='MainMenu'>
<li class='Sel'>
<a href='#'>Click Me</a>
<ul>
<li class='HasSub'>
<a href='#'>Hover Over Me</a>
<ul>
<li>Link</li>
<li>Link</li>
</ul>
</li>
</ul>
</li>
</ul>
据说,当鼠标悬停在“Hover Over Me”上时,应该显示同级 ul。它在 Firefox 中运行良好,但在 IE8 中则完全不起作用。我确信我以前见过 IE8 中使用的“+”同级选择器,我哪里出错了?
I am creating a menu system using a UL/LI structure. I'm trying to use sibling selectors for hover/show-sub-menus.
I'm using this;
#MainMenu li.Sel ul li.HasSub a:hover+ul {
display: block;
}
The UL structure would be something like this;
<ul id='MainMenu'>
<li class='Sel'>
<a href='#'>Click Me</a>
<ul>
<li class='HasSub'>
<a href='#'>Hover Over Me</a>
<ul>
<li>Link</li>
<li>Link</li>
</ul>
</li>
</ul>
</li>
</ul>
Supposedly, when hovering over "Hover Over Me", the sibling ul should be displayed. It works great in Firefox, but not at all in IE8. I'm sure I've seen the '+' sibling selector used in IE8 before, where am I going wrong?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您需要确保 IE 在标准模式下运行 - 输入如下的文档类型:
From 文档:
You need to make sure IE is running in standards mode - put in a doctype like this:
From the documentation:
在 li 元素上添加悬停并使用此 http 修复 ie 的悬停是否会更简单://www.xs4all.nl/~peterned/csshover.html
即
有帮助
希望对乔希
would it be simpler to add the hover on the li element and fix the hover for ie using this http://www.xs4all.nl/~peterned/csshover.html
ie
Hope that helps
Josh