게시글 HTML 그리고 CSS를 보면 CSS는 HTML을 꾸며주는 언어라는 것을 알 수 있다. 그런데 여기서 HTML로 작성한 웹페이지에서 원하는 부분을 꾸며주기 위해서는 원하는 부분을 지정하는 선택자가 필요하게 된다.
가장 기본적인 선택자는 태그(전체)선택자, ID선택자, Class선택자로 분류 할 수 있다.
태그(선택자) 선택자
1 2 3 | form{ color:red;} |
└ 태그 선택자를 사용하는 문법은 위와 같고, 이 문법이 의미하는 것은 'form'이라는 모든 태그에 color:red; 라는 속성을 부여하는 것을 뜻한다.
ID선택자와 Class 선택자도 문법은 똑같다 다만 ID선택자는 선택자 이름 앞에 '#'을 붙이고 Class선택자는 '.'을 붙인다.
1 2 3 | #apple{ color:red;} |
└ apple이라는 ID 이름을 가진 곳에 color:red 속성을 부여하는 것을 뜻한다
1 2 3 | .melon{ color:red;} |
└ melon이라는 Class 이름을 가진 곳에 color:red 속성을 부여하는 것을 뜻한다
여기서 주의할 부분 ID 선택자는 페이지 내에서 단 한 곳에만 지정할 수 있고, Class 선택자는 같은 이름을 가진 모든 곳에 속성을 부여할 수 있다.
