dlタグ 記述リスト（説明リスト）について
説明リストとして利用するdlタグについてメモします。
HTML5より前のバージョンでは定義リストとして、
用語と説明を定義する目的で使用されるタグでしたが現在は説明リスト
または（description list）記述リストとして汎用的に使用出来るタグとなっています。
使い方の基本
項目に対する説明のいくつかのセットをdlタグで囲む。
|
1 2 3 4 5 6 |
<dl> <dt>イヌ</dt> <dd>イヌ科- イヌ属に分類される哺乳類の一種である。</dd> <dt>ネコ</dt> <dd>食肉目ネコ科ネコ属に分類されるヨーロッパヤマネコが家畜化されたイエネコに対する通称である。</dd> </dl> |
デフォルトのレイアウト
説明箇所が字下げされたようになる。
dlタグ内のdtタグ ddタグのそれぞれの意味について以下のように覚えると理解しやすいです。
- dt : description term
- - 説明項目 –
- dd : description detail
- - 説明項目の詳細 –
汎用的に使えるタグではありますが、
グローバルメニューなどはul olなどのリストタグを使うのがSEO的に好ましいようです。
dlタグを使用したレイアウトについては以下の記事で扱っています。
dlタグを使った表組みレイアウト
dlタグを使ったフォーム(form)レイアウト
Follow me!
