HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <caption> 태그

HTML <caption> 태그는 HTML 문서에서 표의 제목을 정의합니다. 전통적으로, 브라우저는 표 위에 있는 <caption> 태그에서 찾은 텍스트를 렌더링하지만, CSS caption을 사용하여-side 속성이 이 행동을 변경합니다. 이 태그는 일반적으로 <caption> 요소로도 불립니다.

HTML <caption> 요소 (또는 HTML 표 제목 요소)는 표의 제목을 표시하며, 대부분 <table>의 첫 번째 자식 요소로 등장하며 표의 내용 앞에 표시되지만, CSS 스타일을 사용하여 표의 어떤 위치에도 나타날 수 있습니다.

온라인 예제

caption 제목이 있는 표:

예제

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>기본 튜토리얼 웹(oldtoolbag.com)</title>　
</head>
<body>
<table>
　　<caption>This is the caption for the table</caption>
　　<tr>
　　　　<th>Column　1　Heading</th>
　　　　<th>Column　2　Heading</th>
　　　　<th>Column　3　Heading</th>
　　</tr>
　　<tr>
　　　　<td>Data in Column　1, Row　2</td>
　　　　<td>Data in Column　2, Row　2</td>
　　　　<td>Data in Column　3, Row　2</td>
　　</tr>
　　<tr>
　　　　<td>Data in Column　1, Row　3</td>
　　　　<td>Data in Column　2, Row　3</td>
　　　　<td>Data in Column　3, Row　3</td>
　　</tr>
　　<tr>
　　　　<td>Data in Column　1, Row　4</td>
　　　　<td>Data in Column　2, Row　4</td>
　　　　<td>Data in Column　3, Row　4</td>
　　</tr>
</table>
</body>
</html>

테스트를 보고 보세요 ‹/›

이 HTML5문서 예제에서, 우리는 <table> 태그로 표를 만들었습니다.<table> 마크업의 첫 번째는 <caption>입니다. 그런 다음 이 표는3열과4행입니다. 표의1행은 첫 번째 <tr> 마크업으로 정의된 것입니다. 그것은3개의 <th> 마크업으로 정의된 표 제목 셀입니다. 이 표의2부터4행은 <td> 마크업으로 정의된 표 셀입니다.

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 <caption> 태그를 지원합니다.

태그 정의 및 사용 설명

<caption> 요소는 <body> 마크업 내에 위치합니다.
마크업은 <table> 마크업 이후로 첫 번째 마크업으로 등장합니다.

<table> 태그는 <tr>, <th>, <td> 태그로 구성됩니다.

대부분의 브라우저는 표 위에 <caption> 태그를 표시하지만, CSS caption-side 속성이 이 동작을 변경합니다.

<caption> 태그는 표의 제목을 정의합니다.

<caption> 태그는 반드시 <table> 태그 다음에 직접 배치되어야 합니다.

주의: 각 표에 제목을 하나만 지정할 수 있습니다.

ヒント: 기본적으로, 표 제목은 표 위에 가운데 정렬됩니다. 하지만, CSS 속성 text-align과 caption-side는 제목의 정렬과 배치에 사용될 수 있습니다.

HTML 4.01 와 HTML5차이점

align 속성은 HTML에서 제거되었습니다.5중에서 제거됨.

속성

속성	값	설명
align	left right top bottom	HTML5 지원되지 않음. HTML 4.01 사용 중지됨. 　　제목의 정렬 방식을 정의합니다. 다음 중 하나의 값 중 하나일 수 있습니다: left-표에 제목이 나타나는 위치를 나타냄 top -표에 제목이 나타나는 위치를 나타냄 right -표에 제목이 나타나는 위치를 나타냄 bottom -표 하단에 제목이 나타나는 표를 나타냄

전체 속성

<caption> 태그가 지원됨 HTML의 전체 속성。

이벤트 속성

<caption> 태그가 지원됨 HTML 이벤트 속성。

HTML: <center> 태그 HTML: <canvas> 태그