관련 콘텐츠를 section으로 묶기

이번 단계에서 배울 내용

<section>은 문서 안에서 하나의 주제로 묶이는 구역을 나타냅니다. 사용자가 구역의 내용을 알 수 있도록 보통 제목을 함께 둡니다.

단지 모양을 위한 상자가 필요하면 <div>를 쓸 수 있지만, 제목과 관련 문단이 하나의 주제를 이룬다면 <section>이 더 알맞습니다.

예시

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

<section id="weather">
  <h2>오늘의 날씨</h2>
  <p>맑고 따뜻합니다.</p>
  <p>자외선이 강합니다.</p>
</section>

해야 할 일

HTML 제목과 그 아래의 두 설명 문단을 하나의 구역으로 묶으세요. 구역의 id는 html-topic입니다.

완성 조건

• <section id="html-topic">을 한 개 만듭니다.
• 구역의 바로 안쪽에 <h2>HTML</h2>을 둡니다.
• 구역의 바로 안쪽에 설명 문단 두 개를 둡니다.
• 페이지 제목 <h1> 다음에 구역 제목 <h2>를 사용합니다.

작업 방법

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

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

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

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

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

도움말: 기존 제목과 두 문단의 앞뒤에 <section id="html-topic">과 </section>을 추가하세요.