일반적인 웹에서 이야기 하는 차이점 :
class 는 여러개를 사용할 수 있지만, id는 고유성을 가지므로 한 문서에 한번만 사용할 수 있다.
(그냥 모든걸 class 로 정의한고 정의된 class 에 따라서 한번만 사용하던지 여러번 사용하던지 하면 안되나? 뭘 귀찬게 시리 id를 따로 정의해서 한번만 사용해야 하나?)
정의 방법에 따른 차이 :
id = #을 이용해서 정의 한다.
<style type="text/css">
#content_id
{
color : blue;
border : 1px solid red;
font-size : 50pt;
}
</style>
class = .을 이해용서 정의 한다.
<style type="text/css">
.content_class
{
color : red;
font-size : 30pt;
}
</style>
우선 순위에 따른 차이 :
id 와 class 를 동시에 사용시 id가 우선 적용되고 class 는 무시된다. - 중복 속성이 있을 경우
<head>
</head>
<body>
<style type="text/css">
#content_id
{
color : blue;
border : 1px solid red;
font-size : 50pt;
}
.content_class
{
color : red;
font-size : 30pt;
}
</style>
<span id="content_id" class="content_class">차이점</span>
</body>
출력해서 보면 붉은색 테두리, 파란색, 50폰트의 크기를 가진 "차이점" 이라는 글자가 출력 된다. (중복되는 class 속성은 무시됨)
그외로..
하나의 요소에 여러개의 class 를 적용할 수 있다.
<span class="abc def ghi">foo</span>
class 3개 적용 abc, def, ghi
결론
class 는 공통적인 성격을 가지는 요소에 적용 - 가령 폰트, 폰트 크기, 폰트 색갈 등등
id 는 개별적인 성격을 가지는 요소에 적용 - 메뉴창의 크기, 위치 등등
'컴퓨터 > HTML' 카테고리의 다른 글
| 레이어 속성 정리 - div, span [정리중] (0) | 2017.06.07 |
|---|---|
| 고정 메뉴바 만들기 (0) | 2017.06.03 |
| 티스토리 글상자 크기 조절 및 가운데정렬하기 (0) | 2017.05.31 |
| 티스토리 스킨을 만들자 (0) | 2017.05.25 |