표의 특징
표에 대한 HTML의 기본 디자인은 표 전체의 테두리와 셀(cell) 사이에 여백이 기본적으로 지정되어 있다. 이 여백을 무시하려면 <table> 태그에 border-collapse 효과의 값으로 collapse를 주면 된다.
예제
example1.html - (jsfiddle, github)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<style>
table{
border:1px solid gray;
border-collapse: collapse;
}
th{
background-color: #d0d0d0;
font-weight:bold;
}
th,td{
border:1px solid gray;
padding:5px;
}
</style>
</head>
<body>
<table>
<tr>
<th>순서</th>
<th>과목명</th>
<th>토픽수</th>
</tr>
<tr>
<td>1</td>
<td>웹서비스 만들기</td>
<td>12</td>
</tr>
<tr>
<td>2</td>
<td>HTML 수업</td>
<td>13</td>
</tr>
<tr>
<td>3</td>
<td>HTML 수업</td>
<td>9</td>
</tr>
<tr>
<td>4</td>
<td>CSS 수업</td>
<td>15</td>
</tr>
</table>
</body>
</html>
