헤딩 레벨을 순서대로 구성하기

이번 단계에서 배울 내용

제목 단계는 문서의 목차처럼 부모와 자식 관계를 보여 줍니다. 페이지 제목은 <h1>, 큰 구역의 제목은 <h2>, 그 안의 작은 구역은 <h3>을 사용합니다.

제목 단계는 모양 때문에 건너뛰지 않습니다. 예를 들어 <h2> 다음의 하위 제목을 바로 <h4>로 작성하면 문서 구조를 이해하기 어려워집니다.

예시

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

<h1>동물 도감</h1>
<section>
  <h2>포유류</h2>
  <h3>고양이</h3>
</section>

해야 할 일

준비된 제목 구조를 <h1>, <h2>, <h3> 순서로 고치세요. 웹 개발은 페이지 제목, HTML은 큰 구역 제목입니다. 문서 구조라는 작은 구역 제목을 새로 추가합니다.

완성 조건

• 웹 개발을 나타내는 <h1>을 한 개 작성합니다.
• HTML을 나타내는 <h2>를 한 개 작성합니다.
• 문서 구조를 나타내는 <h3>을 한 개 작성합니다.
• 제목 단계를 <h1> → <h2> → <h3> 순서로 사용합니다.

작업 방법

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

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

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

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

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

도움말: 숫자가 작을수록 더 상위 제목입니다. 글자 크기는 나중에 CSS로 조절합니다.