요소, 클래스, 선택자(Type, Class&ID Selector)

css는 크게 이런 구조로 이루어져있다.

selector {
	property: value;
}

selector의 종류는 크게 세 종류로 나누어진다.

1. Type selector

html 태그 셀렉터, html의 태그들을 직접 지칭한다.
ex) h1, p, blockquote, div 등

2. Class selector

class의 값을 지칭함. .name(앞에 점 붙여야함)
css에서 단한번의 선언으로 style을 만들어 놓고 html에서 적용하고 싶은 요소들에 해당 class값을 주는 식으로 편리하게 스타일 적용이 가능하다.
한 요소에서 여러개의 class값을 가질 수 있음!
ex)
<div class="box-1 box-2 box-3">
->이때 꼭 서로 띄워줘야 여러 클래스로 인식됨.
->여기서 .box-1으로 불러도 되고 box-2, box-3 다 상관없다.
이때 유의할 점은 .box-0.box-1, .box-1.box-0, .box-0.box-1.box-2 이렇게 불러도 된다는 건데, 반드시 중간에 공간을 남기지 않고 딱붙여 써줘야 하나로 인식함.
(.box-1.box-2는 box-1이자 box-2인 애라고 해석!!)

3. ID selector

신분증과 같은 너낌. 단 하나만 지칭한다
ID가 예를들어 sy이라면, css에서 #을 붙여서 #sy이라고 부름.

<div class="box active" id="sy"><div>
-> css에서 div.box.active라고 불러줄 수 있겠다!
(div이자 box 클래스이자 active 클래스. 한편으로는 Id값을 sy로 갖는것!)