반응형
ID와 Class의 어떻게 다른 한번 알아봅시다.
클래스와 아이디의 차이점은
클래스는 여러개를 사용할 수 있지만 아이디는 고유성을 가지므로 한 문서에 한번만 사용할 수 있습니다.
홈페이지 전체적인 스타일을 일관성있게 지정하기 위해서는 클래스(class)의 사용이 필수적입니다.
id 선택자와 class 선택자의 차이는 문서 안의 '복수'의 요소에 스타일을 적용하는 것인가 아니면 '유일'한 요소에 스타일을 적용하는 것인가입니다. 결론적으로 말하면 id는 '유일'한 요소에 적용, class는 '복수'의 요소에 적용할 수 있습니다.
class : '복수'의 요소에 스타일을 적용
id : '유일'한 요소에 스타일을 적용
1. Class 선택자
<style type="text/css">
p.blue {color:blue}
</style>
<p>일반적인 아무말 입니다.</p>
<p class="blue">blue 라는 이름의 클래스가 지정된 문단입니다.</p>
<p class="blue">class 는 여러번 사용할 수 있습니다.</p>
class 선택자는 문서 안 복수의 요소에 스타일을 적용하는 경우에 사용합니다.
요소명에 피리어드(.)와 class명(임의의 이름)을 붙여 구별합니다.
한 문단에 복수 사용이 가능합니다.
2. ID 선택자
<style type="text/css">
#green {color:green}
</style>
<p>일반적인 문단입니다.</p>
<p id="green">이 문단의 id는 green입니다.</p>
id 선택자는 문서 안에 있는 단 하나의 요소에 스타일을 적용하는 경우에 사용합니다.
선택자에 샤프(#)와 id명(임의의 이름)을 붙여 식별합니다.
id는 문서안에 하나의 요소에 스타일을 적용하는 경우에 사용합니다.