打開子菜單時主導航有效CSS

Question

我想讓主菜單處於活動狀態（背景顏色相同的子菜單背景色），因此打開子菜單時主菜單顏色變爲活動狀態，我試圖使其無法工作，任何人都可以請看看它是什麼錯我的CSS？

JSfiddle demo

nav { 
 
float: left; 
 
width: 100%; 
 
background: #6c9d1c; 
 
border-bottom: 5px solid #e57817; 
 
font-family: 'MyriadPro-Regular'; 
 
} 
 
nav > ul { 
 
list-style: none; 
 
margin: 0; 
 
padding: 0; 
 
font-size: 0; 
 
text-align: center; 
 
} 
 
nav > ul > li { 
 
list-style: none; 
 
padding: 0; 
 
margin: 0; 
 
position: relative; 
 
display: inline-block; 
 
} 
 
nav > ul > li > a { 
 
color: #fff; 
 
text-decoration: none; 
 
font-size: 16px; 
 
text-transform: uppercase; 
 
padding: 7px 17px 3px 17px; 
 
font-weight: 700; 
 
display: block; 
 
line-height: normal; 
 
} 
 
nav > ul > li > a:hover { 
 
background-color: #e57817; 
 
color: #fff; 
 
text-decoration: none; 
 
} 
 
nav > ul > li > ul { 
 
list-style: none; 
 
padding: 0; 
 
margin: 0; 
 
display: none; 
 
position: absolute; 
 
left: 0; 
 
top: 30px; 
 
width: 100%; 
 
text-align: left; 
 
} 
 
nav > ul > li:hover ul { 
 
display: block; 
 
} 
 
/*main menu active on submenu open*/ 
 
nav > ul > li > ul > li > a:hover nav > ul > li > a:hover { 
 
background-color: #e57817; 
 
} 
 
/*Submenu*/ 
 
nav > ul > li > ul > li { 
 
padding: 0; 
 
margin: 0; 
 
list-style: none; 
 
display: block; 
 
} 
 
nav > ul > li > ul > li > a { 
 
display: block; 
 
background: #e57817; 
 
color: #fff; 
 
font-size: 14px; 
 
font-family: Arial; 
 
border-bottom: 1px solid #fcb65a; 
 
padding: 8px 20px; 
 
} 
 
nav > ul > li > ul > li > a:hover { 
 
background-color: #fcb65a; 
 
color: #fff; 
 
text-decoration: none; 
 
}

<nav> 
 
    <ul> 
 
    <li><a href="corporate-training/">Main Menu</a> 
 
     <ul> 
 
     <li><a href="corporate-training/">Submenu one</a></li> 
 
     <li><a href="soft-skills-training/">Sub Menu Two</a></li> 
 
     </ul> 
 
    </li> 
 
    </ul> 
 
</nav>

Answer 1

您正在使用<a>的:hover選擇這意味着當光標移動在<ul>在<a>文本不再hovered。該<ul>仍然是其母公司<li>的一部分，但這樣改：

nav > ul > li > a:hover { 

到

nav > ul > li:hover { 

這裏有一個更新的小提琴：https://jsfiddle.net/nc5yqah9/2/