Css 基于多个类选择元素

当标签有两个类时，我有一个样式规则要应用于标签。有没有办法在没有JavaScript的情况下执行此操作？换言之：

仅当

li

同时应用了

.left

和

.ui类选择器

类时，我才想应用我的样式规则。

你是说两个类？“链”选择器（它们之间没有空格）：

这将选择具有

class1

且具有

class2

的所有元素

就你而言：

li.left.ui-class-selector {

}

正式文件：

---

---

正如akamike在InternetExplorer6中指出的，这种方法存在一个问题，您可能需要阅读以下内容：

链选择器不仅限于类，您还可以对类和ID执行此操作

课程

.classA.classB {
/*style here*/
}

类别和Id

.classA#idB {
/*style here*/
}

#idA#idB {
/*style here*/
}

Id&Id

.classA#idB {
/*style here*/
}

#idA#idB {
/*style here*/
}

除了IE6之外，当前所有优秀的浏览器都支持这一点，它基于列表中的最后一个选择器进行选择。所以“.classA.classB”将仅基于“.classB”进行选择

为了你的案子

li.left.ui-class-selector {
/*style here*/
}

或

---

您可以使用以下解决方案：

CSS规则适用于具有以下两个类的所有标记：

.left.ui-class-selector {
    /*style here*/
}

li.left.ui-class-selector {
   /*style here*/
}

CSS规则适用于具有以下两个类的

的所有标记：

.left.ui-class-selector {
    /*style here*/
}

li.left.ui-class-selector {
   /*style here*/
}

jQuery解决方案：

$("li.left.ui-class-selector").css("color", "red");

document.querySelector("li.left.ui-class-selector").style.color = "red";

Javascript解决方案：

$("li.left.ui-class-selector").css("color", "red");

document.querySelector("li.left.ui-class-selector").style.color = "red";

---

请注意，IE6不喜欢这些，因为它不读取类链。它将只查看链中的最后一个类。它不是：）所有主要网站都已放弃、正在放弃或计划在不久的将来放弃对IE6的支持。。做同样的事@安德烈亚斯·博尼尼：是的，我知道。老实说，我已经很长时间不关心IE6了。（我删除了我之前的评论，因为我发现了另一个关于这个问题的问题。）是的，你根本不能在IE6中使用它们，只需要花更长的时间来设计你的元素。例如，分别设置每个类的样式，并使用适当的CSS特性尽可能地覆盖它们。今年我甚至都不需要支持IE10，完全放弃IE已经指日可待了。我热爱未来。☺ - 请看Double Class selector Id&Id是一个概念上奇怪的选择器。我认为Double Id选择器是不可能的，因为它说同一个元素需要两个不同的Id。