为什么我的子菜单没有显示定义的悬停更改？
我正在试图找到为什么我的下拉菜单（只有HTML，CSS)不工作的原因。我正在使用经典的：hover选项来更改显示：none；显示：flex；。我的目标是，当用户悬停在“Unsere Produkte”上时，会出现一个子菜单。在需要隐藏之前。如果有人能帮我，我会很高兴的。非常感谢。
null
/* Desktop Navigation Bar fixed*/
.hidden{
display:none;
flex-direction: column;
position: absolute;
z-index: -5;
background-color: #FFFEF9;
padding-left:2%;
padding-right:2%;
transition: all .375s;
}
.hidden a{
margin-top: 5%;
margin-bottom: 5%;
background-color: #FFFEF9;
}
.hidden a:hover{
color: #BF9D1D;
}
#produkt:hover > .hidden {
display:flex;
z-index: 888;
flex-direction: column;
position: absolute;
z-index: -5;
background-color: #FFFEF9;
padding-left:2%;
padding-right:2%;
transition: all .375s;
}<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="fixed-nav">
<div class="header">
<div class="col-1 head-1"></div>
<div class="col-3"></div>
<div class="col-1 sans-serif-caption xy">
<div class="header-box1 col-4 sans-serif-caption">
<li class="space"><a href="#UeberUns">Über Uns</a></li>
<li class="space hidden-1">
<a id="produkt">Unsere Produkte</a>
<ul class="hidden">
<a href="#">Unterfußdüngung mit KS NP MIX</a>
<a href="#">HARMI-SOIL 8.0/15 </a>
<a href="#">Agrimax Konzentrat</a>
</ul>
</li>
</div>
<div class="header-box2 col-4">
<li>
<image src="media/logo_2.svg" alt="logo"/>
</li>
</div>
<div class="header-box1 sans-serif-caption col-4">
<li class="sans-serif-caption space"><a href="#Kontakt">Kontakt</a></li>
<div class="search sans-serif-caption">
<input type="text" placeholder="Suche">
<image src="media/search-24px.svg" alt="search-icon" />
</div>
<div class="language-button row sans-serif-caption">
<image src="media/language-24px.svg" alt="language-icon" width="14px" height="14px"/>
<a>de</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>null
共有1个答案
“>”选择器指向直接子元素。
在html中，和
-
是同级元素。
所以改用“~”，它选择同级元素。
像这样：
#produkt:hover ~ .hidden {
display:flex;
z-index: 888;
flex-direction: column;
position: absolute;
z-index: -5;
background-color: #FFFEF9;
padding-left:2%;
padding-right:2%;
transition: all .375s;
}
-
问题内容： 场景：我刚刚连接到流，并创建了一个新的存储库 工作区。我加载了它的2个组件，并修改了一些代码。如果打开 “待更改”视图，则在那里看不到任何待更改（并且我的“显示 完整视图”已选中，因此我应该同时看到传入，传出和 挂起的更改集）。 我的文件已保存，显然可以看到文件中的更改，但是 在“未决更改”视图中没有未决更改。 问题答案： 为了使更改显示在“挂起的更改视图”中，您需要： 刷新您的软件包
-
问题内容： 我是iOS的新手。我正在尝试显示一个弹出菜单，但是我却无法显示菜单。请帮忙。这是我的代码： 请帮助我显示弹出菜单。 先感谢您。 问题答案：
-
我不熟悉eclipse IDE。我在代码中做了一些更改，希望签入/提交我的更改到svn。但当我右键点击一个项目并选择团队选项时，我看不到提交、更新等选项。我在互联网上搜索过这个问题，并尝试了以下选项， 未安装 关于我正在使用的eclipse IDE的更多详细信息如下，版本：Luna Service Release 1（4.4.1）Build id:20140925-1800 我在windows 8
-
我自己处理悬停事件来添加一个三角形指针和一个水平对齐的子菜单栏。当单击顶部菜单时，它可以很好地显示和导航到子菜单。问题是在悬停期间，试图将鼠标移动到子菜单时，子菜单栏会消失。 TIA 代码： null null
-
我使用火狐浏览器。我尝试鼠标悬停在菜单上，但不显示其相应的子菜单，当悬停在主菜单上使用selenium网络驱动程序。它只选择菜单“索赔”，并仅在那里停止。它不执行testScript进一步，因为鼠标悬停子菜单不显示。所以呢 超文本标记语言代码 我必须悬停在菜单"索赔"和选择子菜单"新索赔" 在此处输入图像描述 硒代码 如下图所示，驾驶员检测到菜单“声明”，因为它的颜色比其他菜单的颜色稍暗。但子菜单
-
这应该是一个相对简单的问题，但它让我发疯。我正在尝试在JavaFX中创建扫雷器（主要用于练习），但我甚至无法显示一个简单的矩形。我以前运行过一次游戏，但我试图使游戏更加抽象，因此更容易编码，但我遇到了不显示任何问题。 我消除了所有无关的代码，使其尽可能简单。我基本上是在尝试创建一个名为Box的具有特定颜色和大小的矩形，将框添加到窗格中，并显示窗格。为了使Box成为可以在窗格上显示的节点，我使Box