문서 구조 선택자

부모-자식 관계

element가 한 단계로 관계되어있는경우를 부모-자식관계라고 한다.

예) head-title, body-p, p-strong, ol-li

조상-자손 관계

element가 두 단계 이상으로 관계되어있는경우를 조상-자손관계라고 하며, 그때부터 부모-자식관계는 이루어질수 없다.

예) html-li, body-a, ul-ol

자식선택자 -> >

p > strong {color : red;}

p태그 아래의 strong태그의 색깔을 red로 바꾼다.

자손선택자 -> 공백

p a {font-weight : bold;}

p태그아래의 a태그의 글씨에 bold효과를 준다.

인접형제선택자 -> +

p + h1 {color : blue;}

p태그와 그에 인접한 형제관계인 h1태그의 색깔을 blue로 바꾼다.