CSS 예제 2 / 20
선택자를 조합할수록 더 정교하게 콕 집어 스타일을 줄 수 있습니다. 아래 목록의 CSS 규칙을 하나씩 지워보며 차이를 확인해보세요.
자손 선택자
>
+
[속성]
:first-child
💡 이렇게 바꿔보세요
.menu li (공백)와 .menu > li (부등호)의 차이를 꼭 구분하세요 — 공백은 '모든 후손', > 는 '직계 자식'만
li:first-child 는 '형제 중 첫 번째' — 무조건 li의 첫 번째 자식이라는 뜻이 아니에요
selectorA + selectorB 는 A 바로 다음에 오는 형제 B
← CSS 예제 목록