보통 신입을 뽑아보면 class와 id의 구분의 이해부터 안되더라구요
미디어쿼리라니요 ㅋㅋㅋ -_-;;;

아하 -ㅂ-;; 이번에 갈곳의 디자이너는 그정도 구분은 했으면 하는 바램..

알고는 있으나 설명은 어렵다..... 입니다.
보통 제가 디자이너들에게 설명할때 이렇게 이야기 합니다.

하나의 학교에 홍길동이라는 학생이 있습니다.
그래서 교내 방송으로 홍길동이를 호출합니다.

1학년에 홍길동이가 4명
2학년에 홍길동이가 5명
3학년에 홍길동이가 6명

총 15명이 교장실로 호출되어 왔습니다.
교장선생이 당황해 합니다.. -_-;;;

자 그래서 1학년에 홍길동이를 찾아서 호출하지만 4명이 왔습니다
1학년이면서 2반이라는 홍길동이를 찾았지만 2명이 옵니다.. -_-;;

클래스는 전 확교의 홍길동이란 class를 가지고 호출을 했기때문이니다.
그래서 1학년이면서 2반이면서 23번 학생인 홍길동을 불러옵니다.
이게 종속과 상속의 개념입니다.

자 그러면 헷갈리니 1학년이면서 2반이면서 23번의 학생에게 특별한 id를 부여합니다. 다음에 불르기 편하게 (주민번호같은)  이것이 id의 개념입니다.

자 그런데 이 id는 사용법이 몇가지 있는데요
id를 특정 dom(학생)에게 사용하는 방법과

id를 학년이나 학반에 부여해서 종속개념으로 23번을 불러오는 방법입니다.
일반적인 css를 가지고 layout으로 상용할경우 종속으로 많이 사용합니다.

하지만 jquery같이 특정 버튼에 이벤트를 걸려고 할경우 id를 특정 dom(학생)에게
걸게 됩니다.

아.. 뭐 쓰다보니 좀 길어졌네요 ... 대략 요정도 입니다.
이해 안가시면 더 좋은 강의를 -_-;; 쿨럭

요약하면 class = 학생이름
id = 주민번호 -_-;;;