<table></table> : 테이블 전체적인 태그

<tr></tr> : 행(row) 태그

<td></td> :  하나의 데이터 셀(cell)/일반적인 데이터 표현

<th></th> : 하나의 데이터 셀/헤더 표현

colspan :  열 합치기 (쉽게 생각하면 좌우 합치기)

rowspan :  행 합차기  (쉽게 생각하면 위아래 합치기)

 

<예제>

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
	<table border="1px" width="100%">
		<tr>
			<th colspan="5">삼일 아파트</th>
		</tr>	
		<tr>
			<td>401호</td>
			<td>402호</td>
			<td>403호</td>
			<td>404호</td>
			<td>405호</td>
		</tr>
		<tr>
			<td rowspan="2">301호</td>
			<td>302호</td>
			<td colspan="2">303호</td>
			<td>304호</td>
		</tr>
		<tr>
			<td>202호</td>
			<td>203호</td>
			<td>204호</td>
			<td>205호</td>
		</tr>
		<tr>
			<td colspan="3">101호</td>
			<td>104호</td>
			<td>105호</td>
		</tr>
	</table>
</body>
</html>

 

'프로그래밍 > html_css' 카테고리의 다른 글

css - box의 이해  (0) 2020.08.29
css - clear 이해  (0) 2020.08.29
css - layout 연습  (0) 2020.08.29
css - block의 이해  (0) 2020.08.29
css - 태그의 테두리 제어  (0) 2020.08.29

+ Recent posts