지난 게시물을 통해 한 영역에 두 개의 css 속성을 중복해서 주는 방법을 알아보았습니다. 이번 게시글은 css 페이지 내에서 html영역을 좀더 섬세하게 지정하는 방법을 정리해 보겠습니다.
.assign th{
background-color:aliceblue;
}위의 css 셀렉팅은 html 문서 내에서 assign 이라고 이름지어진 클래스 내의 <th>태그를 의미합니다. 혹은
.assign > th{
background-color:aliceblue;
}이런 방식으로 표현 할 수도 있겠구요.
좀더 긴 표현을 찾아볼까요?
.container header p.title {
font-size: 50px;
}
위의 css 표현은 container클래스 안에 있는 <header> 태그 속 "title"이라고 이름붙여진 <p>태그를 의미합니다.
.container > header > p.title {
font-size: 50px;
}
역시나 이렇게 표현 할 수도 있겠구요. 위와 같은 방식으로 html문서에서 정교한 셀렉팅을 할수 있을 뿐만 아니라, CSS 문서 편집시 가독성을 증가시킬 수 있습니다.
