Правило CSS применяется только в том случае, если элемент имеет классы BOTH

Скажем, у нас есть эта разметка:

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

Есть ли способ выбрать только <div>, который имеет классы BOTH abc и xyz (последний) и переопределяет его ширину линии, чтобы эффективная ширина была 200px?

Что-то вроде этого:

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

Ответ 1

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

... или просто:

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

Ответ 2

Ниже применимы ко всем тэгам со следующими двумя классами

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

применяется к тегам div со следующими двумя классами

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

Если вы хотите изменить это, используя jQuery

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

Ответ 3

Если вам нужно прогматическое решение, это должно работать в jQuery: $(".abc.xyz").css("width", 200);