仅当元素具有BOTH类时才应用CSS规则

Question

假设我们有这个标记：

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

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

这样的事情：

[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

如果你需要一个循序渐进的解决方案，这应该适用于jQuery：

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