Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】dl要素の使い方

dl要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

dlオブジェクトは、定義リストを表すオブジェクトです。このHTML要素は、用語とその説明(定義)のペアをグループ化し、Webページ上で構造的に表現するために利用されます。具体的には、定義する用語を示す<dt>(definition term)要素と、その用語に対する説明や定義を示す<dd>(definition description)要素を子要素として含みます。<dl>要素の内部には、通常、一つ以上の<dt>要素と、それに続く一つ以上の<dd>要素の組み合わせを配置することで、情報セットを構成します。これにより、コンテンツの意味的な関連性を明確にし、ブラウザや検索エンジン、アクセシビリティツールに対して、情報の構造を正確に伝えることができます。

例えば、Webサイトの用語集、よくある質問とその回答(FAQ)、製品の仕様詳細リストなど、特定の項目とそれに対応する詳細な説明が必要な場面で効果的に活用されます。利用する際は、<dt>要素と<dd>要素が必ず<dl>要素の直接の子要素として配置されるように注意してください。HTML Living Standardでは、定義リストだけでなく、名前と値の組を表現する一般的な記述リストとしても利用が推奨されており、メタデータの表示やダイアログボックス内の項目など、幅広い情報構造の表現にその柔軟性が発揮されています。

公式リファレンス: <dl>: The Description List element

構文(syntax)

1<dl>
2  <dt>定義される用語</dt>
3  <dd>用語の説明文</dd>
4  <dt>別の用語</dt>
5  <dd>別の用語に関する説明</dd>
6</dl>

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ