dl, dt, dd 요소

dl, dt, dd 요소

'용어'와 '그 설명' 으로 구성된 목록을 '정의형 목록 (definition list)' 이라고 합니다. 정의형 목록은 dl 요소로 정의하고

용어 (definition term)를 나타내는 dt 요소와 그 설명 (definition description)인 dd 요소를 포함 합니다.

많은 브라우저에서 dd 요소가 들여쓰기가 되어 표시 됩니다.

 

dl 요소는 블록 레벨 요소이지만 dt 요소와 dd 요소 이외의 요소를 포함 할 수 없습니다. 

dt 요소는 인라인 요소이며 인라인 요소와 텍스트를 포함할 수 있습니다.

dd 요소는 블록레벨 요소이며 인라인 요소와 텍스트를 포함할 수 있고, 또 블록 레벨 요소를 포함할 수 있습니다. 

 

<dl>      <dt>MIDI</dt>      <dd>Musical Instrument Digital Interface의 약자. 음악 데이터의 세계공용규격이며 웹에서 일반적으로 사용되는 음성파일        형식. 선율을 음표로 표현하는 데이터 타입이기 때문에 파일 사이즈가 작고 웹에서의 배급에 적합한 특징이 있다. 확장자는        ".mid" 또는 ".midi".       </dd>      <dt>MP3</dt>      <dd>       <p>MPEG Audio Layer-3의 약자. 영상데이터의 압축방식인 MPEG-1 안의 음성데이터 압축기술을 적용하여 작성된          음성파일 형식. 확장자는 "mp3".</p>        <p>CD 정도의 음질인 무압축의 WAVE 파일과 비교할 때 파일사이즈를 1/11정도까지 압축할 수 있다.</p>      </dd>   </dl>

MIDI    Musical Instrument Digital Interface의 약자. 음악 데이터의 세계공용규격이며 웹에서 일반적으로 사용되는 음성파일 형식. 선율을 음표로 표현하는 데이터 타입이기 때문에 파일 사이즈가 작고 웹에서의 배급에 적합한 특징이 있다. 확장 자는 ".mid" 또는 ".midi".     MP3   MPEG Audio Layer-3의 약자. 영상데이터의 압축방식인 MPEG-1 안의 음성데이터 압축기술을 적용하여 작성된 음성 파일 형식. 확장자는 "mp3". CD 정도의 음질인 무압축의 WAVE 파일과 비교할 때 파일사이즈를 1/11정도까지 압축할 수 있다.

 

정의형 목록은 '용어'와 '그 설명' 이라는 사용법 외에도 '참고문서'와 '그 설명', '링크' 와 '그 설명', '날짜' 와 '갱신정보' 등 다양한 용도로 이용됩니다.

 

<dl>      <dt>2010년 5월 28일</dt>      <dd>html / css 게시판에 <a href="cafe.naver.com/webmarkup" title="XHTML 관련 내용">XHTML</a>      관련 내용 입력.</dd>  </dl>

 

dt 요소에 '카테고리명'을, dd 요소에 '그 내용'을 지정하는 사용법도 있습니다.

 

<dl>      <dt>스터디</dt>      <dd>묻고답하기</dd>      <dd>Tip</dd>      <dd>html / css</dd>      <dd>웹관련용어</dd>   </dl>

 

[출처] dl, dt, dd 요소 (웹표준 스터디) |작성자 밝은아이