我的问题是,如果我将鼠标悬停在子菜单上,则高级菜单却没有。我想将新闻和子点(例如补丁)悬停。但是,如果我悬停补丁,新闻就不会。我希望你能帮助我
这是我的密码。
nav .aktuell > a{
background-color: #576574;
}
nav {
width: 100%;
height: 48px;
background-color: #8395A7;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav > ul > li {
float: left;
}
nav > ul > li > ul {
display: none;
}
nav > ul a {
display: block;
white-space: nowrap;
padding: 15px;
background: #8395A7;
text-decoration: none;
}
nav ul > li > ul > li a {
background: #8395A7;
color: white;
}
nav > ul > li:hover > ul {
display: block;
position: absolute;
}
nav > ul > li > ul > li {
position: relative;
}
nav ul li a:hover {
background-color: #576574;
}
nav ul li a {
color: white;
}
<nav>
<ul>
<li class="aktuell"><a href="index.html">Startseite</a></li>
<li><a>News</a>
<ul>
<li><a href="news-patches.html">Patches</a></li>
<li><a href="news-champions.html">Champions</a></li>
</ul>
</li>
<li><a href="guides.html">Guides</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>
</nav>
谢谢您的帮助:)
答案 0 :(得分:1)
您需要更改
[1]
到
nav ul li a:hover {
background-color: #576574;
}
nav ul li:hover > a {
background-color: #576574;
}
nav .aktuell > a{
background-color: #576574;
}
nav {
width: 100%;
height: 48px;
background-color: #8395A7;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav > ul > li {
float: left;
}
nav > ul > li > ul {
display: none;
}
nav > ul a {
display: block;
white-space: nowrap;
padding: 15px;
background: #8395A7;
text-decoration: none;
}
nav ul > li > ul > li a {
background: #8395A7;
color: white;
}
nav > ul > li:hover > ul {
display: block;
position: absolute;
}
nav > ul > li > ul > li {
position: relative;
}
nav ul li:hover > a {
background-color: #576574;
}
nav ul li a {
color: white;
}
答案 1 :(得分:0)
替换此行
nav ul li:hover a {
background-color: #576574;
}