This page was translated from English by the community.Learn more and join the MDN Web Docs community.
<section>: 일반 구획 요소
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015년 7월.
HTML<section> 요소는 HTML 문서의 독립적인 구획을 나타내며, 더 적합한 의미를 가진 요소가 없을 때 사용합니다. 보통<section>은 제목을 포함하지만, 항상 그런 것은 아닙니다.
In this article
시도해 보기
<h1>Choosing an Apple</h1><section> <h2>Introduction</h2> <p> This document provides a guide to help with the important task of choosing the correct Apple. </p></section><section> <h2>Criteria</h2> <p> There are many different criteria to be considered when choosing an Apple — size, color, firmness, sweetness, tartness... </p></section>h1,h2 { margin: 0;}참고 :요소의 콘텐츠를 외부와 구분하여 단독으로 묶는 것이 나아보인다면<article> 요소가 더 좋은 선택일 수 있습니다.
| 콘텐츠 카테고리 | 플로우 콘텐츠,구획 콘텐츠, 뚜렷한 콘텐츠. |
|---|---|
| 가능한 콘텐츠 | 플로우 콘텐츠. |
| 태그 생략 | 불가능, 시작과 끝에 태그를 추가하는 것은 필수입니다. |
| 가능한 부모 요소 | 플로우 콘텐츠를 허용하는 모든 요소. 단, <section> 요소는<address>의 자손이 될 수 없습니다. |
| 가능한 ARIA 역할 | alert,alertdialog,application,banner,complementary,contentinfo,dialog,document,feed,log,main,marquee,navigation,search,status,tabpanel |
| DOM 인터페이스 | HTMLElement |
특성
이 요소는전역 특성만 포함합니다.
사용 일람
예제
>이전
html
<div> <h2>Heading</h2> <img>some image</img></div>이후
html
<section> <h2>Heading</h2> <img>some image</img></section>명세
| Specification |
|---|
| HTML> # the-section-element> |