728x90
class
class 선택자는 특정 집단의 여러 요소를 한 번에 선택할 때 사용된다. 이러한 특정 집단을 클래스(class)라고 하며, 같은 클래스 이름은 가지는 요소들을 모두 선택한다. 선택자 명명시 숫자로 시작하면 안되며, 언더코어(_)나 하이픈(-)을 제외한 특수문자는 사용 불가하다.
id
id 선택자는 CSS를 적용할 대상으로 특정 요소를 선택할 때 사용된다. 웹 페이지에 포함된 여러 요소 중에서 특정 아이디 이름을 가지는 요소만 선택한다. 여러 요소에 같은 아이디 이름을 사용해도 작동은 하지만 중복된 아이디를 가지고 javascript 작업을 하게 되면 오류가 발생하여 되도록 하나의 웹 페이지 안에서 중복되지 않게 사용해야한다. id 속성 명명시 최소 1글자 이상이며, 공백은 없어야한다.
id는 class보다 상위 선택자라 동일 요소에 중복 정의 시, id 스타일이 우선 적용된다. class는 동일한 이름으로 사용이 가능하나 id는 동일한 이름으로 사용이 불가능하다. 또한 class는 동일한 여러 곳에 적용하여 사용이 가능하나 id는 한 곳에서만 적용 후 사용해야 한다. class와 id 선언명은 동일해도 무관하다.
id 속성은 태그에 유일한 이름을 붙이고 싶을 때 사용하며, class 속성은 같은 유형으로 반복되는 태그들을 유형별로 분류할 때 사용한다.
참고링크
728x90
'IT > Front' 카테고리의 다른 글
[jQuery] .attr() (0) | 2024.02.07 |
---|---|
[jQuery] 문법 (0) | 2024.02.07 |
[CSS] padding과 margin의 차이 (1) | 2024.01.31 |
[HTML] div와 span의 차이 (1) | 2024.01.30 |
[React] UI Library (0) | 2022.06.04 |