CSS에 상위 선택자가 있습니까?

Question

앵커 요소의 직접 상위 요소인

요소를 선택하려면 어떻게 해야 하나요?

예를 들어 내 CSS는 다음과 같습니다.

li <
    자산 가치;
}

분명히 JavaScript를 사용하여 이를 달성하는 것이 가능하지만 CSS 레벨 2에 고유한 해결 방법이 있기를 바랐습니다.

스타일을 지정하려는 메뉴는 CMS에 의해 생성되므로 활성 요소를

요소로 이동할 수 없습니다. 메뉴 생성 모듈이 필요하지만 그렇게 하고 싶지는 않습니다.)

Answer 1

:has() CSS 의사 클래스

를 사용할 수 있습니다.

하지만 브라우저 지원이 제한되어 있습니다(Firefox는 아직 지원되지 않습니다).

Answer 2

현재 CSS에는 요소의 상위 요소를 선택하여 모든 브라우저에서 올바르게 작동하도록 하는 방법이 없습니다.

Selector Level 4 Working Draft에는 이 기능을 제공하는 :has() 의사 클래스가 포함되어 있습니다. jQuery의 구현과 유사하지만 현재 Firefox에서는 지원되지 않습니다.

으아악

현재 Firefox에서만 기본적으로 이 기능을 지원하지 않습니다.

한편, 완전한 크로스 브라우저 지원을 갖춘 상위 요소를 선택해야 하는 경우 Firefox에서 JavaScript를 사용해야 합니다.