引用具有附加类的类

Question

我在页面上有一个jquery滑块功能，当幻灯片旋转时，我需要改变LI标签的样式。

所以当滑块进入li时，类看起来像这样：

<li class="first sliderkit-selected">

当它离开时它看起来像这样：

<li class="first">

但是当课程进入“第一次滑动选择”时，我需要从样式表中引用它，但不确定它是如何构建的，到目前为止我已经玩过：

li.sliderkit-selected li.first {
    background-color: red;
}

但它似乎没有把它拿起来。

我知道你可以在每个类之间使用逗号，但是我想要一个样式在这两个类合在一起时专门引用，如果这有意义的话。

感谢。

Answer 1

您正在寻找li.sliderit-selected.first：

li.sliderkit-selected.first{
    background-color: red;
}

另见：

• CSS Selectors Level 3: Class selectors

    

  以下规则匹配P个元素，其class属性已分配了包含pastoral和marine的空格分隔值的列表：

   p.pastoral.marine { color: green }
  

    

  此规则与class="pastoral blue aqua marine"匹配，但与class="pastoral blue"不匹配。

Answer 2

要选择具有多个类的DOM元素，请在选择器中连接类：

li.sliderkit-selected.first {
    background-color: red;
}

Answer 3

如果要选择具有多个类的元素，只需使用点附加类，如下所示：

li.first.sliderkit-selected { /* your rules */ }

这意味着“li标记包含类first 和类sliderkit-selected”。

Answer 4

您可以这样写：

.sliderkit-selected.first {
    background-color: red;
}

或

.first.sliderkit-selected {
    background-color: red;
}