CSS 선택기를 사용하여 여러 클래스의 요소를 대상으로 지정하는 방법은 무엇입니까?

여러 클래스가 있는 요소를 대상으로 하는 CSS 선택기

CSS로 작업할 때 요소가 특정 기준을 충족하는지 확인하는 것이 중요합니다. 그러한 시나리오 중 하나는 둘 이상의 특정 클래스에 속하는 요소를 식별하는 것입니다. 이 문서에서는 브라우저 호환성 고려 사항과 함께 이 문제에 대한 간단한 솔루션을 제공합니다.

여러 클래스가 있는 요소를 선택하려면 CSS 클래스 선택기 구문을 사용하세요. 클래스 이름을 공백으로 구분하지 않고 간단히 연결하면 됩니다. 예를 들어 "foo" 및 "bar" 클래스가 모두 포함된 요소를 선택하려면:

.foo.bar {
  /* Styles for element(s) with foo AND bar classes */
}

그러나 Internet Explorer 6 인터프리터는 클래스 선택기를 다르게 연결합니다. 이 브라우저의 경우 마지막 클래스 선택기만 인식됩니다. 호환성을 보장하려면 다음 코드 사용을 고려하세요.

* {
  color: black;
}

.foo.bar {
  color: red;
}

이 코드는 "foo" 및 "bar" 클래스가 모두 있는 요소에 "빨간색" 색상을 할당하고 다른 모든 요소는 기본 "검은색"을 유지합니다. 색상. 이 접근 방식을 구현하면 IE6을 포함한 다양한 브라우저에서 일관된 스타일을 적용할 수 있습니다.

위 내용은 CSS 선택기를 사용하여 여러 클래스의 요소를 대상으로 지정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!