요소에 BOTH 클래스가있는 경우에만 적용 할 CSS 규칙

요소에 BOTH 클래스가있는 경우에만 적용 할 CSS 규칙

---

이 질문에는 이미 답변이 있습니다.

• 두 클래스가있는 요소에 적용되는 CSS 선택기 1 답변

이 마크 업이 있다고 가정 해 봅시다.

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

유효 너비를 200px로 만들기 위해 <div>BOTH abc와 xyz클래스 (마지막 클래스)가있는 클래스 만 선택 하고 인라인 너비를 재정의하는 방법이 있습니까?

이 같은:

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

---

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

... 또는 간단히 :

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

---

아래는 다음 두 클래스가있는 모든 태그에 적용됩니다.

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

다음 두 클래스가있는 div 태그에 적용

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

jQuery를 사용하여 이것을 수정하려면

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

---

프로그래밍 방식의 솔루션이 필요한 경우 jQuery에서 작동해야합니다.

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

참고 URL : https://stackoverflow.com/questions/5796654/css-rule-to-apply-only-if-element-has-both-classes