Html 悬停时不显示下拉链接

在长时间脱离HTML/CSS之后，我最近使用一种我以前使用过的方法创建了一个带有下拉链接的菜单，并惊讶地发现它们的这个应用程序不起作用

我用过这个

ul li:hover ul{ display:block;}

在悬停时“打开”我的菜单，但它们永远不会出现。我尝试过在不同的代码块周围添加div标记，但没有效果。我错过了什么把戏

---

jsfiddle here:

您的html与css选择器不一致

ul.menu li:hover > ul {
  display: block;
  background: green;
}

没有任何

ul

元素是

li

元素的直接子元素。您可以更改html，以便

ul

是

li

元素的直接子元素

正文{
边际：0px；
}
a{
文字装饰：无；
宽度：8em；
/*每个链接的宽度*/
}
/*格式列表*/
保险商实验室{
文本对齐：居中；
保证金：0；
填充：0；
列表样式：无；
}
菜单{
高度：2.5em；
宽度：100%；
填充：0；
保证金：0；
边界：0；
背景色：#4545；
}
菜单李{
浮动：左；
位置：相对位置；
}
菜单李a{
光标：指针；
显示：块；
颜色：白色；
线高：2.5em；
填充：0 10px；
}
菜单{
背景:#555；
显示：无；
位置：绝对位置；
左：0；
最高：100%；
}
菜单：悬停{
背景：红色；
}
ul.菜单li：悬停>ul{
显示：块；
背景：绿色；
}

标题