CSS为nth孩子（）但只有，如果还匹配一个类

-1

我在这里看到一些类似的问题，但没有什么完全相同或有答案。我希望我想做的事情是可能的。CSS为nth孩子（）但只有，如果还匹配一个类

基本上，我有一个在WordPress内部生成的顶级导航。我希望翻滚时导航项目发生某些事情，并且它们是当前菜单项。但是这些东西在每个导航项中都不相同。我有以下CSS

.responsiveSelectContainer ul li:nth-child(1) .current-menu-item, 
.responsiveSelectContainer ul li:nth-child(1) a:hover{ 
    border-bottom: solid 3px #107B7E; 
    color: #107B7E !important; 
}

（1-6六个导航项目，用不同的颜色）

的：悬停部分工作得很好，但我不能让它使用CSS时适当的导航项目也具有当前菜单项目的类别。

我尝试过和没有.current-menu-item之前的空间无济于事。我错过了什么？

谢谢。

添加相关的HTML（由WP生成）

<div class="nav responsiveSelectContainer"> 
    <ul id="menu-top-menu-1" class="menu responsiveSelectFullMenu"> 
     <li class="oneLineNav strategy menu-item menu-item-type-taxonomy menu-item-object-category current-menu-item menu-item-335"><a href="/strategy/">Strategy</a></li> 
     <li class="managing-change menu-item menu-item-type-taxonomy menu-item-object-category menu-item-260"><a href="/managing-change/">Managing Change</a></li> 
     <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3365"><a href="/leadership/">Leadership</a></li> 
     <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3364"><a href="/transform/">Transformation</a></li> 
     <li class="innovation-and-creativity menu-item menu-item-type-taxonomy menu-item-object-category menu-item-291"><a href="/innovation-and-creativity/">Innovation</a></li> 
     <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3369"><a href="/corporate-culture/">Corporate Culture</a></li> 
    </ul> 
</div>

再次，CSS工作的一个：悬停，只是没有在.current菜单项

我也确定， CSS知道这是.current-menu-item通过添加它尊重的其他随机CSS。

来源

2015-07-02 Reverend Dovie

类是对自身li，因此它需要去与li:nth-child(1)：

.responsiveSelectContainer ul li.current-menu-item:nth-child(1), 
.responsiveSelectContainer ul li.current-menu-item:nth-child(1) a:hover{ 
    border-bottom: solid 3px #107B7E; 
    color: #107B7E !important; 
}

（类选择无论之前或之后:nth-child(1)似乎无所谓，我只是把它作为前约定）。

如果!important只是您尝试的剩余部分，请务必将其删除，如果该规则不再需要应用。

来源

2015-07-03 06:23:32 BoltClock

最后，下面的工作：.responsiveSelectContainer ul li：nth-child（1）.current-menu-item a问题是我试图编辑li当我应该一直在工作 –

CSS为nth孩子（）但只有，如果还匹配一个类

回答

相关问题