CSS :defined 가상 클래스

정의와 사용법

CSS :defined 가상 클래스는 모든 정의된 요소와 일치합니다.

이 가상 클래스는 표준 요소와 성공적으로 정의된 사용자 정의 요소에 사용될 수 있습니다。

예제

사용 :defined 가상 클래스：

custom-element:not(:defined) {
  border-color: grey;
  color: grey;
}
custom-element:defined {
  background-color: salmon;
  border-color: maroon;
  color: black;
}
/* 로드 메시지 표시 */
custom-element:not(:defined)::before {
  content: "로딩 중...";
  position: absolute;
  inset: 0 0 0 0;
  align-content: center;
  text-align: center;
  font-size: 25px;
  background-color: white;
}
/* 로드 메시지 제거 */
custom-element:defined::before {
  content: "";
}

자신이 직접 시도해 보세요

CSS 문법

:defined {
  css 선언;
}

기술 세부 사항

브라우저 지원

표格에 표시된 숫자는 이 표결류를 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다。