주요 태그_2
주요 태그 2
오랫동안 사용돼온 태그나 사용빈도가 높은 태그들을 정리한다.
table
표를 만드는 태그이다.
<table border="2">
<thead>
<tr>
<th>이름</th> <th>성별</th> <th>주소</th> <th>회비</th>
</tr>
</thead>
<tbody>
<tr>
<td>bak</td> <td>male</td> <td>busan</td> <td>1000</td>
</tr>
<tr>
<td>kim</td> <td>female</td> <td>seoul</td><td>500</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>합계</td> <td></td> <td></td> <td>1500</td>
</tr>
</tfoot>
</table>
이름 | 성별 | 주소 | 회비 |
---|---|---|---|
bak | male | busan | 1000 |
kim | female | busan | 500 |
합계 | 1500 |
표의 구조
<table border=~> : table 태그의 속성 중 border는 표의 테두리 두께를 설정한다.
<thead> : 표의 머리행을 지정한다. 코드의 위치가 어디든지 태그로 묶이면 항상 표의 최상단에 위치하게 된다.
<tbody> : 표의 본문에 해당하는 영역을 지정한다.
<tfoot> : 표의 바닥으로 지정한다. 이 태그로 묶으면 코드의 중간에 있어도 항상 표의 맨 아래에 위치한다.
<th> : 표의 머리를 강조하여 표시한다.
<td> : table data의 줄임말로 표에 들어갈 데이터를 정하는 태그이다. 이 데이터의 수 만큼 표의 열이 만들어진다.
<tr> : table row의 줄임말로 표의 행을 표현한다. td를 묶어서 하나의 행으로 만든다.
셀 병합
표를 합친다.
이름 | 성별 | 주소 | 회비 |
---|---|---|---|
bak | male | busan | 1000 |
kim | female | 500 | |
합계 | 1500 |
<tr>
<td>bak</td> <td>male</td> <td rowspan="2">busan</td> <td>1000</td>
</tr>
<tr>
<td colspan="3">합계</td> <td>1500</td>
</tr>
<td rowspan=”~”> : 열을 합친다. 합치려는 열의 td 태그 안의 속성으로 입력한 숫자만큼 칸을 합친다.
<td colspan=”~”> : 행을 합친다. 합치려는 행의 td 태그 안의 속성으로 입력한 숫자만큼 칸을 합친다.