CSS :where() 의사 클래스와 :is() 의사 클래스의 핵심 차이점으로 올바른 것은?

어려움 MDN Web Docs

보기 및 정답

A :where()는 특이도(Specificity)를 항상 0으로 만들고, :is()는 내부 선택자 중 가장 높은 특이도를 적용한다

B :nth-child() 선택자와 :nth-of-type() 선택자는 형제 요소의 타입에 관계없이 동일한 요소를 항상 선택하게 된다

C ::placeholder 의사 요소는 입력 필드에 값이 있어도 표시되지만 :placeholder-shown은 빈 필드에서만 활성화된다

D ::placeholder와 :placeholder-shown은 동일한 기능을 하지만 전자는 구형 브라우저에서만 지원되는 레거시 문법이다

:is()와 :where()는 모두 여러 선택자를 그룹화하는 기능적 의사 클래스입니다. 핵심 차이는 :where()의 특이도가 항상 0이라는 점입니다. 이를 활용하면 오버라이드가 쉬운 기본 스타일을 작성할 수 있습니다.

개념 확인은 퀴즈로, 실력은 실전 프로젝트로.
투더제이 코딩클래스에서 시작하세요.

로그인