[selector] CSS - :has() 가상선택자 - 지정 요소 갖는 모든 요소 선택. (= :has선택자 = 해즈선택자) (아직 지원 X)

목차

1. :has() 예제 - 지정 요소 갖는 모든 요소 선택
2. :has() 정의
3. :has() 구문

:has() 예제 - 지정 요소 갖는 모든 요소 선택

 

자식 요소로 img 갖는 모든 a 태그.

a:has(> img)

 

바로 뒤에 p 요소가 있는 모든 h1 태그

h1:has(+ p)

 

:has() 정의

 

내부에 지정 요소 갖는 모든 요소 선택. (아직 지원 X)

 

---

 

1.

jQuery의 :has() 대응해 도입 예정인 CSS 가상클래스.

 

2

Firefox 제외한, 주요 최신 브라우저 모두 지원.

 

3. MDN :has() 예제 보기
https://developer.mozilla.org/en-US/docs/Web/CSS/:has

 

:has() 구문

 

:has(selector)

 

---

[매개변수]

 

selector

필수. 지정 선택자. (※ 모든 요소 가능)