CSS 공부 중에 #과 .의 차이에 대해서 정확히 알고 싶어서 정리해봤다.

CSS 선택자

CSS에서 선택자란 스타일 적용을 위해서 특정 요소들을 선택해주는 요소라고 할 수 있다.

전체 선택자 *

HTML 페이지 내부의 모든 요소에 같은 CSS속성을 적용하기 위한 선택자이다.

클래스 선택자 .

클래스 선택자는 .apple .class1 .class2 처럼 사용하게 되며
해당 속성값을 가진 HTML 요소를 찾아서 선택하게 된다.
p.class1, div.apple 처럼 태그 뒤에 붙여서 사용하게 되면
해당 태그에 한해서만 클래스 선택자가 동작하게 된다.

ID 선택자 '#'

id 선택자는 class 속성이 아니라 id속성을 사용하는 것을 제외하곤 클래스 선택자와 유사하다.

클래스 선택자와 ID 선택자는 어떨 때 써야 할까?

여러번 반복될 필요가 있는 스타일은 클래스 선택자를 사용하는 것이 좋다. 하지만 한번만 적용될 스타일은 ID 선택자를 이용하는 것이 좋다.

보통 폰트크기, 색상 등 추후 다른 곳에 적용될 수 있는 스타일 지정시 클래스 지정자를 사용하면 되고, ID선택자는 주로 HTML내에서 요소의 배치 방법 지정 등에 사용하게 된다.