：第n个子选择器类不适用于我的页面我想申请第二个

Question

<ul class="nav"> 
<li class="dropdown opener"><a href="https://moodle.org" class="dropdown-toggle" data-toggle="dropdown" title="Moodle community">Moodle community</a> 
<ul class="dropdown-menu dropotron level-0 left"> 
<li><a title="Moodle free support" href="https://moodle.org/support">Moodle free support</a></li> 
<li class="divider">&nbsp;</li> 
<li class="dropdown-submenu"><a href="https://moodle.org/development" class="dropdown-toggle" data-toggle="dropdown" title="Moodle development">Moodl</a> 
<ul class="dropdown-menu dropotron level-0 left"> 
<li><a title="Moodle Docs" href="http://docs.moodle.org">Moodle Docs</a></li> 
</ul> 
</li> 
</ul> 
</li> 
<li class="divider">&nbsp;</li> 
<li><a title="Moodle.com" href="http://moodle.com/">Moodle.com</a></li> 
<li class="dropdown opener langmenu"><a href="#" class="dropdown-toggle" data-toggle="dropdown" title="Language">English (en)</a> 
<ul class="dropdown-menu dropotron level-0 left"> 
<li><a title="English (en)" href="http://192.168.1.123/moodle30nw/?redirect=0&amp;lang=en">English (en)</a></li> 
<li><a title="عربي (ar)" href="http://192.168.1.123/moodle30nw/?redirect=0&amp;lang=ar">عربي (ar)</a></li> 
</ul> 
</li> 
</ul> 
.navbar .nav > li:nth-of-type(2) a:hover{ 
    background-color: #407a61 !important; 
    color:#fff !important; 
}  

为什么我的css在这里不工作我想更改第二个元素的悬停背景颜色我该如何应用它。有没有其他的方式来做到这一点。

Answer 1

入住这里你Answer

你必须从CSS 这里删除>运营商是Demo

HTML

<div class="navbar "> 
<div class="nav"> 
    <ul> 
    <li>First One</li> 
    <li>Second One</li> 
    <li>Three One</li> 
    <li>Four One</li> 
    </ul> 
</div> 
</div> 

CSS

.navbar .nav li:nth-of-type(2):hover { 

    color:red; 
}