这是我的问题。我正在使用小部件菜单。
我想为每个具有 ACTIVE 类的 li:nth-child 添加不同的 CSS 规则。 这是我的代码:
.wk-slideshow-default .nav .active
li:nth-child(1) span:hover {
width:19px;
height:18px;
background:url(/images/1r.png) !important;
overflow:hidden;
}
听起来很简单,对吧?好吧,只有当我删除 li:nth-child(1) 时,此代码才有效。这是因为 html 的工作方式如下:
<ul class="nav">
<li></li>
<li></li>
<li class="active"></li>
<li></li>
<li></li>
</ul>
我无法编辑 HTML,因为这是 joomla 扩展。
本质上,我想告诉CSS的是:
if you are li:nth-child(1) without the active class, change background to 1.jpg
if you are li:nth-child(1) WITH the active class, change background to 1r.jpg
if you are li:nth-child(2) without the active class, change background to 2.jpg
if you are li:nth-child(2) WITH the active class, change background to 2r.jpg
诸如此类。 (没有事件类就已经可以正常工作了)
有什么办法可以做到这一点吗... li:nth-child(1, .active)?
最佳答案
您可以设置li.active:nth-child(1)
通过层次结构,可以设置element[attribute].class:pseudo
关于jquery - 我想知道是否可以给 nth-child 一个类属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24127209/