캡션 추가하기
Coddy HTML 여정의 Fundamentals 섹션에 포함된 레슨 — 60개 중 49번째.
HTML 테이블에서 caption은 테이블의 제목이나 설명입니다. 이는 테이블 콘텐츠에 대한 간략한 설명을 제공하여 사용자가 테이블의 목적을 더 쉽게 이해할 수 있도록 돕습니다. 캡션은 <caption> 태그를 사용하여 생성하며, 이 태그는 <table> 태그 바로 다음에 위치해야 합니다.
HTML에서 테이블에 캡션을 추가하는 기본 구문은 다음과 같습니다:
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>
챌린지
쉬움캡션이 포함된 테이블을 포함하는 HTML 문서를 만드세요. 테이블은 다음과 같은 구조를 가져야 합니다:
- 테이블을 정의하기 위한
<table>태그. - 테이블을 설명하기 위해 "Product Inventory"라는 텍스트가 포함된
<caption>태그. - 두 개의 헤더 셀(
<th>)이 있는 헤더용 테이블 행(<tr>). 헤더 셀에는 "Product Name"과 "Quantity"가 표시되어야 합니다. - 두 개의 데이터 셀(
<td>)이 있는 테이블 행(<tr>). 셀에는 "Laptop"과 "5"가 표시되어야 합니다. - 두 개의 데이터 셀(
<td>)이 있는 또 다른 테이블 행(<tr>). 셀에는 "Mouse"와 "10"이 표시되어야 합니다.
치트 시트
<caption> 태그는 HTML 테이블에 대한 제목이나 설명을 제공합니다. 이 태그는 <table> 태그 바로 다음에 위치해야 합니다.
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>직접 해보기
<!DOCTYPE html>
<html>
<body>
<!-- 여기에 코드를 작성하세요 -->
</body>
</html>
실력 점검이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.
