dl 요소

정의

description list; dl 요소는 이름-값 형태의 그룹(기술 목록)으로 구성된 연상 목록을 나타냅니다. 이름-값 형태의 그룹은 '단어와 정의', '메타데이터와 값', '질문과 답변', 이 외에 '이름과 값' 형태의 그룹이면 됩니다.

마크업 규칙

Flow Interactive Metadata Phrasing Embedded Heading Sectioning

  • 플로우 컨텐츠에 속합니다.
  • 플로우 컨텐츠의 위치에 사용할 수 있습니다.
  • 자식 요소로 하나 이상의 dt 요소와 그 뒤를 따르는 하나 이상의 dd 요소로 구성된 0개 이상의 그룹을 포함할 수 있습니다.
  • dl 요소 안에 내용이 같은 dt 요소가 중복되면 안 됩니다.
  • 이름-값은 1:1 형태가 아닌 1:다, 다:1, 다:다 형태를 취할 수 있습니다.

기본 문법은 다음과 같습니다. 데모

<dl>
  <dt>이름</dt>
  <dd>오덕후</dd>
  <dt>취미</dt>
  <dd>피규어 수집</dd>
</dl>

예제1:

<dl>
  <dt>이름</dt>
  <dt>이름</dt>
  <dd>오덕후</dd>
  <dt>취미</dt>
  <dd>피규어 수집</dd>
</dl>

dl 요소 안에 내용이 같은 dt 요소가 중복되면 안 됩니다.

예제2:

<dl>
  <dt>이름</dt>
  <dt>Name</dt>
  <dd>오덕후</dd>
  <dt>취미</dt>
  <dt>hobby</dt>
  <dd>피규어 수집</dd>
</dl>

하나 이상의 이름(dt 요소)에 하나의 값(dd 요소) 형태 - 다:1 형태

예제3:

<dl>
  <dt>이름</dt>
  <dd>오덕후</dd>
  <dd>吳德后</dd>
  <dd>Oh deok-hu</dd>
</dl>

하나의 이름(dt 요소)에 하나 이상의 값(dd 요소) 형태 - 1:다 형태

예제4:

<dl>
  <dt>이름</dt>
  <dt>Name</dt>
  <dd>Oh deok-hu</dd>
  <dd>오덕후</dd>
  <dt>취미</dt>
  <dt>hobby</dt>
  <dd>피규어 수집</dd>
  <dd>Figures collecting</dd>
</dl>

하나 이상의 이름(dt 요소)에 하나 이상의 값(dd 요소) 형태 - 다:다 형태

예제5:

<dl>
  <dt><dfn>솔까말</dfn></dt>
  <dd>솔직히 까놓고 말해서</dd>
  <dt><dfn>근자감</dfn></dt>
  <dd>근거없는 자신감</dd>
  <dt><dfn>갑툭튀</dfn></dt>
  <dd>갑자기 튀나와 자신의 캐릭터를 공격하는 행위</dd>
  <dt><dfn>듣보잡</dfn></dt>
  <dd>듣도 보도 못한 잡놈</dd>
  <dt><dfn>레알</dfn></dt>
  <dd>진짜(Real)</dd>
</dl>

dl 요소를 이용한 용어집 예제입니다. dfn 요소로 단어의 용어를 정의합니다.

예제6:

<dl>
  <dt>카테고리</dt>
  <dd>피규어 소식</dd>
  <dt>작성일</dt>
  <dd>2011-04-01</dd>
  <dt>작성자</dt>
  <dd>오덕후</dd>
</dl>

dl 요소를 이용한 '메타데이터와 값' 형태 마크업 예제입니다.

속성

속성명 설명
전역 속성 공통 속성

메모

HTML4/XHTML1과의 차이점, 접근성, 보충 내용 그리고 편집자 의견 등을 포함하고 있습니다.

  • HTML4에서 단어(개념)와 정의의 '정의 목록'이었지만 HTML5에서는 이름-값 형태의 그룹으로 구성된 '연관 목록'으로 기존 HTML4보다 상위 개념을 가집니다.
  • compact 속성은 폐기deprecated된 속성입니다. 더는 사용하지 않습니다.
  • 시작/종료 태그 생략 정보는 명세 8.1.2.4 선택적 태그의 주석을 참조해 주세요.

참조

기준 명세를 바탕으로 명세 번역과 레퍼런스 제작이 이루어졌습니다. 최근 내용은 최신 명세를 확인해 주세요.

관련 요소

 
html5/element/dl.txt · 마지막 수정: 2013/11/19 13:35 (외부 편집기)
이 레퍼런스는 클리어보스가 제작/운영하고 있으며, 다음의 라이센스를 따릅니다 :CC 저작자표시-비영리-동일조건변경허락 2.0
Recent changes RSS feed World Wide Web Consortium Driven by DokuWiki