반응형
테이블의 기타 속성으로 간단한 예제를 작성합니다.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>테이블 태그 기타</title>
</head>
<body>
<table border="1" width="400">
<caption>준철이가 좋아하는 연예인</caption>
<colgroup>
<col width="20%" />
<col width="80%" />
</colgroup>
<thead>
<tr>
<th>
이름
</th>
<th>
직업
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
최강희
</td>
<td>
연기자
</td>
</tr>
<tr>
<td>
한승연
</td>
<td>
가수
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2" align="center">
총 2명
</td>
</tr>
</tfoot>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>테이블 태그 기타</title>
</head>
<body>
<table border="1" width="400">
<caption>준철이가 좋아하는 연예인</caption>
<colgroup>
<col width="20%" />
<col width="80%" />
</colgroup>
<thead>
<tr>
<th>
이름
</th>
<th>
직업
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
최강희
</td>
<td>
연기자
</td>
</tr>
<tr>
<td>
한승연
</td>
<td>
가수
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2" align="center">
총 2명
</td>
</tr>
</tfoot>
</table>
</body>
</html>
테이블에 캡션 넣기 caption 전체 테이블에 대한 설명
직접 td에서 width를 사용해서 값을 넣어줄수 있지만 colgroup 태그를 사용해서
깔끔하게 정리하고 설정할 수 있다. (colgroup 레이아웃 잡을때 사용)
thead는 볼드체로 보여지고 가운데 정렬
<thead, tbody, tfoot>는 테이블의 머리,몸체,꼬리부분을 설정 할 수 있다.
직접 td에서 width를 사용해서 값을 넣어줄수 있지만 colgroup 태그를 사용해서
깔끔하게 정리하고 설정할 수 있다. (colgroup 레이아웃 잡을때 사용)
thead는 볼드체로 보여지고 가운데 정렬
<thead, tbody, tfoot>는 테이블의 머리,몸체,꼬리부분을 설정 할 수 있다.
20.테이블태그기타.htm반응형
'jQuery | javascript | CSS' 카테고리의 다른 글
| 22.XHTML- Form (0) | 2009.07.27 |
|---|---|
| 21.XHTML- IFrame (0) | 2009.07.27 |
| 19.XHTML- 템플릿 (0) | 2009.07.27 |
| 18.XHTML- 테이블 속성 ( Table 속성) (0) | 2009.07.27 |
| 17.XHTML- body 속성 (0) | 2009.07.27 |
Comments