Question

我有一个DNN网站，它使用以下代码作为菜单下拉列表。

IE8不喜欢它，子菜单也不会拉下来。

.nav-collapse:not(.in) .nav li:hover > ul {
    display: block;
}

您可以转到IE8中的http://dnnsample.azurewebsites.net来复制此内容。关于我们有一个子菜单。如果你有IE11，你可以按F12＆gt;按ctrl + 8并将文档模式更改为8.

任何人都知道在IE8中使用这种方法的另一种方法吗？

Answer 1

IE8中不支持:not CSS3选择器。

尝试使用:not选择您的元素，您的悬停将正常工作。

http://caniuse.com/css-sel3

Answer 2

您可以使用两个CSS规则。第二个应该覆盖第一个但仅适用于具有.in类的元素。它应该与使用:not()的选择器具有相同的效果。

.nav-collapse .nav li:hover > ul {
    display: block;
}

.nav-collapse.in .nav li:hover > ul {
    display: none; // or whatever display value you have as default
}

您的CSS无法正常工作的原因是因为:not()仅受IE9 +支持。 See this MDN article for reference

CSS Hover在IE8中不起作用

2 个答案: