클래스(class)와 아이디(id)

 

HTML 요소에게 '이름'을 주는 방법은 class, id 방법이 있다.

 

 

위 코딩에서 어떤 부분은 클래스가 되어있고 어떤 부분은 id로 되어있다.

클래스(class)

30번째 줄 코드를 보면  p요소에 "big-blue-text"라는 클래스 이름을 갖고 있습니다. 그러면 css에서. big-blue-text에 스타일을 입혀주면 됩니다. 클래스 이름이라는 걸 나타내는 '.(마침표)'를 잊지 말자!!!

아이디(id)

28번째 줄 코드를 보면 p요소는 "best-text"라는 아이디를 갖고 있습니다. 그러면 css에서 #favorite-text에 스타일을 입혀주면 됩니다. 클래스 이름을 나타내기 위해 '.(마침표)'를 붙인 것처럼 아이디를 나타내기 위해서는 '#(샾 표시)'를 써줘야 합니다.

 

 

클래스, 아이디 차이점

클래스와 아이디. 얼핏 보기에는 똑같아 보이는데요. 핵심적인 차이점 몇 가지가 있습니다:

1. 같은 클래스 이름을 여러 요소가 가질 수 있지만, 같은 아이디를 여러 요소가 공유할 수는 없습니다.

2. 한 요소가 여러 클래스를 가질 수 있지만, 한 요소는 하나의 아이디만 가질 수 있습니다. (단, 한 요소가 클래스도 여러 개 갖고 아이디도 하나 가질 수 있습니다!)