HTML <dl>

定義リスト(Definition List)を作成します。 開始タグ <DT> と終了タグ </DT> の間には DT (Definition Term) 要素タイプ および DD (Definition Description) 要素タイプ を含めることができます。

書式

HTMLでは、タグ名、属性名及び属性値の大文字と小文字を区別しない。

<dl>
  <dt>
    <!-- definition term -->
  </dt>
  <dd>
    <!-- definition description -->
  </dt>
</dl>

属性

次に示す属性をdl要素に指定できる。

class
CSSのクラスを指定する。空白で区切って、複数のクラスを指定できる。
id
HTML文書内で一意な識別子を指定する。
style
CSSのプロパティを指定する。セミコロンで区切って、複数のプロパティを指定できる。
title
ツールチップに適した要素のアドバイザリ情報を指定する。

コンテンツモデル

フロー・コンテンツ

使用例と表示サンプル

<dl>
 <dt>XML</dt>
 <dd>拡張可能なマークアップ言語。</dd>
 <dt>エレメント</dt>
 <dd>XML文書の基本となる情報単位。開始タグから終了タグまで。</dd>
</dl>
XML
拡張可能なマークアップ言語。
エレメント
XML文書の基本となる情報単位。開始タグから終了タグまで。

<DT>

定義語(Definition Term)であることを示します。定義リストタグ <DL> と </DL> の間に記述します。終了タグは省略できます。

書式

<dt>
  <!-- flow content exclude header, footer, sectioning content, and heading content -->
</dt>

開始タグ

dt要素の開始タグは省略できない。

終了タグ

すぐ後ろにdt要素またはdd要素が続く場合は、dt要素の終了タグを省略することができる。ただし、XHTMLの場合は終了タグを省略できない。

コンテンツモデル

dt要素の開始タグと終了タグの間には、フローコンテンツを含めることができる。ただし、以下に示す要素を除く。

具体的には、以下に示す要素を開始タグと終了タグの間に含めることができる。

属性

次に示す属性をdt要素に指定できる。

class
CSSのクラスを指定する。空白で区切って、複数のクラスを指定できる。
id
HTML文書内で一意な識別子を指定する。
style
CSSのプロパティを指定する。セミコロンで区切って、複数のプロパティを指定できる。

使用例と表示サンプル

HTMLタグ <dt> の使用例と表示サンプルを次に示します。

<dl>
  <dt lang="en-GB">colour</dt>
  <dt lang="en-US">color</dt>
  <dd>red, blue, yellow, green, brown, purple etc</dd>
  <dt lang="en-GB">centre</dt>
  <dt lang="en-US">center</dt>
  <dd>the middle of a space, area, or object, especially the exact middle in the centre</dd>
</dl>
colour
color
red, blue, yellow, green, brown, purple etc
centre
center
the middle of a space, area, or object, especially the exact middle in the centre

<DD>

定義の説明文(Definition Description)であることを表します。

書式

<dd>
  <!-- flow content -->
</dd>

HTMLの場合は終了タグ </dd> を省略できます。XHTMLの場合は終了タグを省略できません。

開始タグ

dd要素の開始タグは省略できない。

終了タグ

すぐ後ろにdt要素またはdd要素が続く場合は、dd要素の終了タグを省略することができる。ただし、XHTMLの場合は終了タグを省略できない。

コンテンツモデル

dd要素の開始タグと終了タグの間には、フローコンテンツを含めることができる。具体的には、以下に示す要素である。

属性

次に示す属性をdd要素に指定できる。

class
CSSのクラスを指定する。空白で区切って、複数のクラスを指定できる。
id
HTML文書内で一意な識別子を指定する。
style
CSSのプロパティを指定する。セミコロンで区切って、複数のプロパティを指定できる。

使用例と表示サンプル

<dl>
 <dt>DL</dt>
 <dd>定義リスト(Definition List)</dd>
 <dt>DT</dt>
 <dd>定義語(Definition Term)</dd>
 <dt>DD</dt>
 <dd>定義の説明文(Definition Description)</dd>
</dl>
DL
定義リスト(Definition List)
DT
定義語(Definition Term)
DD
定義の説明文(Definition Description)

JavaScript

JavaScriptからは HTMLDListElement インタフェースを通じてdl要素へアクセスできる。

参考文献

Web Hypertext Application Technology Working Group (2022) "Grouping content" HTML Living Standard