<?xml version="1.0" encoding="EUC-KR" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR" />
<title>테이블</title>
</head>
<body>
<!-- 테이블은 메인페이지에서 사용금지 -->
<!-- 1. 느리기 때문에 -->
<!-- 2. 테이블의 구동방식 : 다른 태그들이 자리를 잡은 후에 테이블이 그 자리를 밀어내고
만들어진다. -->
<table border="1" align = "center" width="500"> <!-- border : attribute -->
<tr> <!-- Table row : 행 -->
<td colspan="2">1행 1열</td>
<td rowspan="2">1행 2열</td>
</tr>
<tr> <!-- Table row : 행 -->
<td>2행 1열</td>
<td>2행 2열</td>
</tr>
</table>
<br />
<br />
<br />
<table border="5" align = "center" width ="200">
<tr> <!-- 테이블 헤더 셀 -->
<th>구분</th>
<th>1열</th>
<th>2열</th>
<th>3열</th>
<th>4열</th>
</tr>
<tr align = "center" valign="top">
<th>1행</th>
<td rowspan="3" >a1</td>
<td colspan="3" >a2</td>
</tr>
<tr align = "center" valign="top">
<th>2행</th>
<td rowspan="2" >b1</td>
<td colspan="2" >b2</td>
</tr>
<tr align = "center" valign="top">
<th>3행</th>
<td >c1</td>
<td rowspan="2" >c2</td>
</tr >
<tr align = "center" valign="top">
<th>3행</th>
<td colspan="2">d1</td>
<td>d2</td>
</tr >
</table>
</body>
</html>
② 실행화면
1행 1열 | 1행 2열 | |
2행 1열 | 2행 2열 |
구분 | 1열 | 2열 | 3열 | 4열 |
---|---|---|---|---|
1행 | a1 | a2 | ||
2행 | b1 | b2 | ||
3행 | c1 | c2 | ||
3행 | d1 | d2 |
'WEB > HTML' 카테고리의 다른 글
WEB 2일차 두번째) a태그 (0) | 2012.09.13 |
---|---|
WEB 2일차 첫번째) FORM태그 (0) | 2012.09.13 |
WEB 1일차 두번째) H태그(헤더태그)와 P태그(문단태그) (0) | 2012.09.13 |