id 는 스타일을 반복적으로 사용하지 않고 웹페이지에서 한번만 사용할 때 쓰이며
class 는 동일한 스타일을 웹페이지내에서 반복적으로 사용할 때 사용합니다.
id 를 사용할려면 CSS에서 id명 앞에 "#"(=샵)을 붙여야 하고(ex: #test) 호출할 때는 id="test" 이런식으로 하시면 됩니다.
class 를 사용할려면 CSS에서 class명 앞에 "."(=마침표)을 넣어야 하고(ex: .test) 호출할 때는 class="test" 이런식으로 하시면 됩니다.
아래 참고소스에서
id는 테이블을 가운데 정렬 하는 #layout_wrap 이 id와 배경색이 서로 다른 class 즉 .td_color1 과 .td_color2를 반복적으로 사용한 예입니다.
▼ 참고소스:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<style type="text/css">
<!--
body { text-align:center; }
#layout_wrap { margin:0 auto; text-align:left; width:500px; }
.td_color1 { background:#00f; }
.td_color2 { background:#f00; }
}
-->
</style>
</head>
<body>
<div id="layout_wrap">
<table cellspacing="0" cellpadding="0">
<tr>
<td width="500" height="20" class="td_color1"></td>
</tr>
<tr>
<td height="20" class="td_color2"></td>
</tr>
<tr>
<td height="20" class="td_color1"></td>
</tr>
<tr>
<td height="20" class="td_color2"></td>
</tr>
<tr>
<td height="20" class="td_color1"></td>
</tr>
<tr>
<td height="20" class="td_color2"></td>
</tr>
<tr>
<td height="20" class="td_color1"></td>
</tr>
</table>
</div>
</body>
</html>
출처 : blog.naver.com/gonewyork0?Redirect=Log&logNo=90104243816