HTML <캡션> 태그
예시
캡션이 있는 테이블:
<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.
정의 및 사용
<caption>태그는 테이블 캡션을 정의합니다 .
< table><caption> 태그 바로 뒤에 태그를 삽입해야 합니다
.
팁: 기본적으로 표 캡션은 표 위에 가운데 정렬됩니다. 그러나 CSS 속성 text-align 및 caption-side 를 사용하여 캡션을 정렬하고 배치할 수 있습니다.
브라우저 지원
| Element | |||||
|---|---|---|---|---|---|
| <caption> | Yes | Yes | Yes | Yes | Yes |
전역 속성
<caption>태그는 HTML의 전역 속성도 지원 합니다 .
이벤트 속성
<caption>태그는 HTML의 이벤트 속성 도 지원합니다 .
더 많은 예
예시
위치 테이블 캡션(CSS 포함):
<table>
<caption style="text-align:right">My savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<br>
<table>
<caption
style="caption-side:bottom">My savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
관련 페이지
HTML DOM 참조: 캡션 개체
기본 CSS 설정
대부분의 브라우저는 <caption>다음 기본값으로 요소를 표시합니다.
예시
caption {
display: table-caption;
text-align: center;
}