HTML / caption / 표(table)에 캡션 붙이는 태그

caption

표(table)에 캡션 붙일 때 caption 태그를 사용합니다.
기본 위치는 표 위 가운데입니다.
캡션 위치는 CSS의 caption-side로 정합니다.

예제

캡션의 위치를 파악하기 위해 표의 가로 크기를 100%로 했고, 테두리를 넣었습니다.

<!doctype html>
<html lang="ko">
	<head>
	<meta charset="utf-8">
		<title>HTML</title>
		<style>
			table { width: 100%; }
			th, td { border: 1px solid #dadada; }
		</style>
	</head>
	<body>
		<table>
			<caption>Table Caption</caption>
			<tr>
				<th>Lorem</th><th>Ipsum</th>
			</tr>
			<tr>
				<td>Dolor</td><td>Amet</td>
			</tr>
		</table>
	</body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

<!doctype html>

<head>

<style>

table { width: 100%; }

th, td { border: 1px solid #dadada; }

</style>

</head>

<body>

<table>

<caption>Table Caption</caption>

<tr>

<th>Lorem</th><th>Ipsum</th>

</tr>

<tr>

<td>Dolor</td><td>Amet</td>

</tr>

</table>

</body>

</html>

HTML

CODING FACTORY

HTML / caption / 표(table)에 캡션 붙이는 태그

caption

예제

HTML

인기 글

최근 글