모든 HTML 엘리먼트는 하나 이상의 컨텐츠 카테고리 엘리먼트의 멤버입니다 — 이러한 카테고리들은 공통되는 특성을 공유하는 엘리먼트를 그룹화합니다. 이는 느슨한 그룹핑이지만(카테고리의 엘리먼트 사이에 실제로 관계를 생성하지은 않습니다), 카테고리들의 공유되는 동작이나 그들의 관계된 규칙을 정의하고 설명하는데 도움이 됩니다. 특히 복잡한 세부사항들을 포함할 때 더욱더 그렇습니다. 엘리먼트는 어떤 카테고리의 멤버가 아닐 수도 있습니다.

컨텐츠 카테고리의 종류에는 다음 세가지가 있습니다:

  • 메인 컨텐츠 카테고리, 여러 엘리먼트들이 서로 공유하는 일반적인 컨텐츠 규칙을 설명합니다.
  • 폼 관련 컨텐츠 카테고리, 폼 관련 엘리먼트에 공통된 컨텐츠 규칙들을 설명합니다.
  • 특정 컨텐츠 카테고리, 일부 엘리먼트만 공유하는 소수의 카테고리를 설명하며, 특정 컨텍스트에서만 가능할 때도 있습니다.

알림: 이러한 컨텐츠 카테고리와 그들의 기능 비교에 대한 상세 내용은 이 글의 범위를 벗어납니다. 궁금하시다면 relevant portions of the HTML specification 글을 읽어보시기 바랍니다..

A Venn diagram showing how the various content categories interrelate. The following sections explain these relationships in text.

메인 컨텐츠 카테고리

메타데이터 컨텐츠

메타 데이터 컨텐츠 카테고리에 속한 엘리먼트는 다큐먼트의 표현이나 동작을 수정하거나 다른 문서에 대한 링크를 설정하거나 다른 대역 외 정보를 전달합니다.

이 카테고리에 속한 엘리먼트들: <base>, <command>, <link>, <meta>, <noscript>, <script>, <style><title>.

플로우 컨텐츠

플로우 컨텐츠 카테고리에 속한 엘리먼트들은 전형적으로 텍스트나 내장된 컨텐츠를 포함합니다. 해당 엘리먼트에는: <a>, <abbr>, <address>, <article>, <aside>, <audio>, <b>,<bdo>, <bdi>, <blockquote>, <br>, <button>, <canvas>, <cite>, <code>, <command> , <data>, <datalist>, <del>, <details>, <dfn>, <div>, <dl>, <em>, <embed>, <fieldset>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <i>, <iframe>, <img>, <input>, <ins>, <kbd>, <keygen> , <label>, <main>, <map>, <mark>, <math>, <menu>, <meter>, <nav>, <noscript>, <object>, <ol>, <output>, <p>, <pre>, <progress>, <q>, <ruby>, <s>, <samp>, <script>, <section>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <table>, <template>, <textarea>, <time>, <ul>, <var>, <video>, <wbr> 그리고 텍스트가 있습니다.

특정 조건이 충족된 경우에만 이 카테고리에 속하는 몇가지 엘리먼트입니다 :

구획 컨텐츠

 

구획 컨텐츠 모델에 속한 엘리먼트는 <header> 엘리먼트, <footer> 엘리먼트, 제목 컨텐츠의 범위를 정의하는 현재 아웃라인에서의 섹션을 생성합니다.

이 카테고리에 속한 엘리먼트는 다음과 같습니다. <article>, <aside>, <nav> 그리고 <section>.

참고: 이 컨텐츠 모델을 일반 내용 구분과 구획 루트 카테고리와 혼동하지 마시오.

제목 컨텐츠

제목 컨텐츠는 명시적인 구획 컨텐츠에 사용 되거나 제목컨텐츠 자체에 의해 암시적으로 정의되는 섹션의 제목을 정의합니다.

제목 컨텐츠에 속하는 엘리먼트는 다음과 같스니다 <h1>, <h2>, <h3>, <h4>, <h5>, <h6> 그리고 <hgroup>.

참고: 일부 제목 컨텐츠가 포함될 가능성이 있지만,  <header> 엘리먼트 에는 정의되지 않습니다.

참고: <hgroup> 엘리먼트는 W3C명세에서 삭제되었으며, WahtWG 에서만 존재합니다.
이론적인 시멘틱 마크업만 가능합니다.

구문 컨텐츠

구문 컨텐츠는 텍스트 혹은 텍스트를 포함한 마크업을 정의합니다. 어구의 시작은 구문을 정의합니다.

구문 컨텐츠에 속하는 엘리먼트는 다음과 같습니다 <abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command> , <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen> , <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr> 그리고 일반 텍스트(공백으로 이루어지지 않은).

특정 조건이 충족된 경우에만 이 카테고리에 속하는 몇가지 엘리먼트입니다 :

  • <a>, 구문 컨텐츠만 포함한 경우
  • <area>, <map> 의 자손인 경우.
  • <del>, 구문 컨텐츠만 포함한 경우
  • <ins>, 구문 컨텐츠만 포함한 경우
  • <link>, itemprop 속성을 가지고 있는 경우.
  • <map>, 구문 컨텐츠만 포함한 경우
  • <meta>, itemprop 속성을 가지고 있는 경우.

내장형 컨텐츠

내장형 컨텐츠는 다른 리소스를 임포트하거나 컨텐츠를 다른 마크업 언어나 네임스페이스로부터 다큐먼트로 삽입합니다. 이 카테고리에 속하는 엘리먼트는 다음과 같습니다 : <audio>, <canvas>, <embed>, <iframe>, <img>, <math>, <object>, <svg>, <video>.

대화형 컨텐츠

대화형 컨텐츠 는 유저 인터렉션을 위해 특별하게 설계된 엘리먼트를 포함합니다. 이 카테고리에 속하는 엘리먼트는 다음과 같습니다 : <a>, <button>, <details>, <embed>, <iframe>, <keygen>, <label>, <select>, and <textarea>.
특정 조건이 충족된 경우에만 이 카테고리에 속하는 몇가지 엘리먼트입니다:

뚜렷한 컨텐츠

 

내용이 비어 있거나 숨겨져 있지 않은 경우 뚜렷한 컨텐츠입니다. 컨텐츠는 렌더링되고 실질적입니다. 플로우 컨텐츠 또는 구문 컨텐츠를 모델로하는 엘리먼트는 적어도 하나의 뚜렷한 노드가 있어야합니다.

 

폼 관련 구성 컨텐츠

폼 관련 구성 컨텐츠 엘리먼트는 form 을 소유자로 삼으며, form 속성에 의해 표현됩니다. form 소유자는 <form> 엘리먼트를 포함하거나 id가 form 속성에 지정된 엘리먼트 입니다.

 이 카테고리에는 하위 카테고리가 존재합니다 :

listed
form.elements 및 fieldset.elements IDL collections 에 나열된 엘리먼트. 내용 <button>, <fieldset>, <input>, <keygen>, <object>, <output>, <select>, 그리고 <textarea>.
labelable
<label> 엘리먼트와 연결할수 있는 엘리먼트. 내용 <button>, <input>, <keygen>, <meter>, <output>, <progress>, <select>, 그리고 <textarea>.
submittable
form을 제출할때 formdata를 구성할수 있는 엘리먼트. 내용 <button>, <input>, <keygen>, <object>, <select>, 그리고 <textarea>.
resettable
form 을 reset 할때 영항을 받는 엘리먼트. 내용 <input>, <keygen>, <output>,<select>, 그리고 <textarea>.

보조 카테고리

알면 유용한 엘리먼트의 일부 보조적인 분류가 있습니다.

스크립트 지원 엘리먼트

스크립트 지원 엘리먼트는 다큐먼트의 렌더링된 결과에 바로 기여하지 않는 엘리먼트입니다. 대신, 스크립트 지원을 위해 제공되거나, 스크립트 코드를 직접 포함하거나 지정하거나 스크립트에서 사용할 데이터를 지정합니다.

 

스크립트 지원 엘리먼트는 다음과 같습니다.

 

 

투명 컨텐츠 모델

 

엘리먼트가 투명 컨텐츠 모델을 갖고있는 경우 투명 엘리먼트가 제거되고 자식 요소로 교체 되더라도 해당 내용이 유효한 HTML 5가되도록 구조화되어야합니다.

예를 들어, <del><ins> 엘리먼트는 투명합니다:

<p>We hold these truths to be <del><em>sacred &amp; undeniable</em></del> <ins>self-evident</ins>.</p>

이러한 엘리먼트가 제거되더라도 이 부분은 유효한 HTML 입니다.(올바른 영어가 아닌 경우).

<p>We hold these truths to be <em>sacred &amp; undeniable</em> self-evident.</p>

다른 컨텐츠 모델

구획 루트.

문서 태그 및 공헌자

이 페이지의 공헌자: cs09g, KlausLee, lovefield, Kaben, azunyan3
최종 변경자: cs09g,