퀴즈 / CSS / 문제

CSS ::first-letter 의사 요소(pseudo-element)의 특징으로 올바른 것은?

쉬움 MDN Web Docs
보기 및 정답
A CSS 선택자의 명시도 계산에서 전체 선택자(*)는 1의 가중치를 가진다
B 블록 요소의 첫 번째 글자에만 스타일을 적용하여 드롭캡 등의 효과를 만든다
C ::after 가상 요소는 대체 요소인 img 태그에서도 정상적으로 작동한다
D 가상 요소는 DOM에 실제 노드로 추가되어 자바스크립트로 접근 가능하다

해설

::first-letter는 블록 레벨 요소의 첫 번째 줄에 있는 첫 글자를 선택합니다. font-size, float, color 등의 속성을 적용하여 신문·잡지 스타일의 드롭캡(drop cap) 효과를 만들 수 있습니다. ::first-line은 첫 번째 줄 전체를 선택하는 별도의 의사 요소입니다.

코딩, 제대로 배우고 싶다면?

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

정규반 살펴보기
START THE LOOP · CHOOSE

시장과 사람의 답을 봤다면,
다음 결과물의 구조를 고릅니다.

한 번의 결과에 기대지 않고 다시 만들 수 있도록, 문제 발견부터 제작·배포·수익화까지 이어지는 전체 흐름을 익혀보세요.

TTJ CLASS에서 다음 구조 고르기
처리 중...