仅当元素具有BOTH类[重复]时才应用的CSS规则

Question

这个问题在这里已有答案：

• CSS Selector that applies to elements with two classes 1回答

假设我们有这个标记：

<div class="abc"> ... </div>
<div class="xyz"> ... </div>
<div class="abc xyz" style="width: 100px"> ... </div>

有没有办法只选择有两个<div>和abc类（最后一个）的xyz并覆盖它的内联宽度，使有效宽度为200px？

像这样的东西：

[selector] {
  width: 200px !important;
}

Answer 1

div.abc.xyz {
    /* rules go here */
}

......或者干脆：

.abc.xyz {
    /* rules go here */
}

Answer 2

以下适用于具有以下两个类的所有标签

.abc.xyz {  
  width: 200px !important;
}

适用于具有以下两个类的div标签

div.abc.xyz {  
  width: 200px !important;
}

如果你想使用jQuery修改它

$(document).ready(function() {
  $("div.abc.xyz").width("200px");
});

Answer 3

如果你需要一个progmatic解决方案，这应该在jQuery中工作：

$(".abc.xyz").css("width", 200);