HTML <section>: 구획 요소
HTML <section> 요소는 문서의 독립적인 구획을 나타내며, 더 적합한 의미를 가진 요소가 없을 때 사용합니다. <section>은 보통 헤딩을 포함합니다.
<h1>사과 고르기</h1>
<section>
  <h2>소개</h2>
  <p>이 문서에서는 사과를 잘 고르는 법에 대해 알아봅니다.</p>
</section>
<section>
  <h2>기준</h2>
  <p>사과를 고를 땐 다양한 것을 고려해야 합니다. 크기, 색상, 단단함, 달콤함, 새콤함... (이어서)</p>
</section>
불러오는 중...
탐색 메뉴는 <nav> 요소로 묶을 수 있고, 블로그 글이나 댓글은 <article> 요소로 묶을 수 있습니다. 그러나 검색 결과를 나타낼 때 사용할 <result>라는 이름의 요소는 없습니다. 이 때가 더 적합한 의미를 가진 요소가 없을 때입니다.
특성
전역 특성만 포함합니다.
사용 일람
- 각각의 <section>을 구분할 수단이 필요합니다. 주로 헤딩(<h1> ~ <h6>) 요소를<section>의 자식으로 포함하는 방법을 사용합니다.
- <section>을 범용 컨테이너로 사용하지 마세요. 오직 스타일링만을 위해 구획을 분할해야 할 필요가 있으면- <div>요소를 사용해야 합니다.
- 묶으려는 콘텐츠를 외부와 분리해서 독립적으로 사용했을 때도 말이 된다면 <section>보다<article>요소를 쓰는 편이 좋습니다.
명세
브라우저 호환성
| 데스크톱 | 모바일 | ||||||
|---|---|---|---|---|---|---|---|
| iOS | Android | ||||||
| Safari | Chrome | Firefox | Safari | Chrome | Firefox | Samsung Internet | |
| section | |||||||