표 제목과 헤더 범위 지정하기

이번 단계에서 배울 내용

<caption>은 표가 무엇을 보여 주는지 알려 주는 제목입니다. <th>는 행이나 열의 기준이 되는 헤더 셀입니다.

scope="col"은 그 셀이 아래쪽 열의 제목임을, scope="row"는 오른쪽 행의 제목임을 나타냅니다. 이 정보는 화면 읽기 도구가 셀의 관계를 설명하는 데 도움을 줍니다.

예시

아래 코드는 사용 방법을 보여 주는 예시입니다. 문제의 정답과는 다른 내용입니다.

<table>
  <caption>과일 재고</caption>
  <thead>
    <tr><th scope="col">과일</th><th scope="col">수량</th></tr>
  </thead>
  <tbody>
    <tr><th scope="row">사과</th><td>3개</td></tr>
  </tbody>
</table>

해야 할 일

주간 시간표에 1학기 주간 시간표라는 제목을 추가하세요. 요일과 과목은 열 제목으로, 월요일과 화요일은 각 행의 제목으로 표시합니다.

완성 조건

• 시간표 안에 <caption>을 한 개 둡니다.
• scope="col"인 열 제목 셀을 두 개 만듭니다.
• scope="row"인 행 제목 셀을 두 개 만듭니다.
• <tbody> 안에 수업 행을 두 개 둡니다.
• 표 제목은 1학기 주간 시간표입니다.
• 페이지 제목을 <h1>부터 순서대로 사용합니다.

작업 방법

1. 에디터에서 index.html을 엽니다.
2. TODO 주석이 있는 부분을 중심으로 코드를 수정합니다.
3. 미리보기에서 결과를 확인한 뒤 제출합니다.

별도의 입력값은 없습니다.

에디터에 준비된 index.html을 열고, 문제에서 안내하는 HTML 요소와 속성을 추가하거나 수정하세요. 브라우저 미리보기로 작성한 결과를 확인할 수 있습니다.

별도의 출력값은 없습니다.

수정한 index.html이 브라우저에서 정상적으로 열리고, 아래의 완성 조건을 모두 만족하면 됩니다.

도움말: 맨 위 제목 행은 <thead>, 실제 데이터 행은 <tbody>로 묶으면 구조를 더 쉽게 구분할 수 있습니다.