본문 바로가기

프론트엔드

[HTML] html class 속성과 id 속성의 차이점

목적의 차이

- class

: 같은 유형으로 반복되는 태그들을 유형별로 분류하고 싶을 때

- id

 : 태그에 유일한 이름을 붙이고 싶을 때 

 

반복가능성의 차이

- class

class 속성은 여러번 반복해서 사용할 수 있고, 동일한 class로 분류된 태그들을 쉽게 관리할 수 있습니다.

- id

id 속성은 전체 페이지에서 단 하나의 요소에만 지정이 가능합니다.

 

CSS 적용의 차이

이렇게 html에서 지정된 id와 class를 css에서 사용할 때에도 차이가 있습니다.

- class

id 속성은 앞에 # 기호를 붙이고 쓰고, 유일한 속성이므로 class보다 우선적으로 적용됩니다.

- id

class 속성은 앞에 .(마침표) 기호를 붙이고 쓰면 됩니다.

 

정리

class id
스타일의 분류에 사용 특정 요소에 이름을 붙이는 데 사용
동일한 값을 갖는 요소 많음 한 문서에 단 하나의 요소에만 적용
. 으로 선택 # 으로 선택