Class 및 ID
class와 id 모두 HTML 속성이다. 즉 태그 안에 다음과 같이 넣을 수 있다.
<div class="button">버튼</div><div id="header">헤더</div>class는 여러 태그들에 적용 가능하다. 즉 같은 이름을 가진 클래스를 여러 태그가 공유할 수 있고, 이를 통해서 여러 태그를 묶어서 관리할 수 있다. 반면 id는 단일 태그에만 사용 가능하다. 예를 들어서 어떤 태그에 "header"라는 id를 사용했다면 다른 태그에서는 "header"라는 id는 사용할 수 없다.
두 속성 모두 CSS를 통해 디자인할 때 사용할 수 있다. class는 .을 통해 접근하고, id는 #을 통해 접근한다는 차이점이 있다. 아래와 같이 적용하면 된다. 참고로 비슷해보이는 name 속성은 CSS에서 사용 불가능하다.
<head>
<style>
.button {
width: 200px;
height: 200px;
}
#header {
border: 20px solid blue;
}
</style>
</head>
| class | id |
| 여러 요소 적용 가능 | 단일 요소만 적용 가능 |
. |
# |
'Language > HTML & CSS' 카테고리의 다른 글
| [CSS] CSS 적용 방법 및 적용 우선순위 (0) | 2025.03.04 |
|---|---|
| [HTML] HTML 태그 (0) | 2025.02.28 |
| [HTML] HTML 간단 소개 (0) | 2025.02.28 |
