<title></title>
HTML로 문서구조를 만들었다면
다음은 CSS를 이용하여 레이아웃을 맞추고 디자인을 꾸밀차례입니다.
예전에는 HTML태그중에서도 디자인을 위한 태그들이 있었는데
이런 태그들은 모두 폐기되고 이런일을 CSS가 맡게 되었습니다.
CSS를 사용하기 위해서는 HTML의 어느 부분을 선택해서
이부분은 이렇게 이렇게 보이게 해라.
해야될것있니다.
바로 이 HTML어느 부분을 선택하는 것이 CSS 선택자(selector)입니다.
선택자를 사용하는데에는 크게
1. 태그로 찾기
2. 아이디로 찾기
3. 클래스로 찾기
가 있는데 이들을 조합해서 사용하게 됩니다.
우선 태그로 찾으려면 그냥 태그를 써주면 됩니다.
header {이렇게 저렇게 그려라}
header 이부분이 선택자이고 중괄호 부분이 어떻게 그려야할지를 명령하는 부분입니다.
즉 header태그는 이렇게 저렇게 그려라 하는 겁니다.
아이디로 찾기는 #을 이용합니다.
#header {이렇게 저렇게 그려라}
이역시 id="header"인것은 이렇게 저렇게 그려라 하는 겁니다.
클래스로 찾기는 .을 이용합니다.
.header {이렇게 저렇게 그려라}
더 말할거 없겠지요? class="header"인것을 말합니다.
우선 기본적인 세가지 selector를 알았으니 이를 조합하는 방법을 알아보겠습니다.
header #menu { 이렇게 저렇게}
아시겠나요? 네 바로 header태그에 포함되는 #menu는 이렇게 저렇게 그려라 입니다.
이렇게 여러 선택자들을 이용해서 문서상의 어느것이라도 골라서
마음껏 스타일을 적용 시킬수 있는것입니다.
처음보면 #, . 이 뭔가 하지만 막상 알고나면 참 쉽습니다.
그럼 고르는 법을 알았으니 이제 여러 스타일을 적용하는 방법을 배워도로록 하겠습니다.