最終更新日

dl要素

dl要素は、「用語とその説明」「質問とその答え」「担当者とその役割」など、名前とその説明との組み合わせによる形式で連続して表示される説明リストを示します。各グループには、1つ以上の名前と、1つ以上の説明の両方またはどちらか一方が含まれます。

dl要素は、Flowコンテンツの記述箇所で使用できます。

HTML5では、1つのdl要素内で、1つの名前に対応するdt要素は1つにするべきとされています。

HTML5での変更点
・dl要素のcompact属性は廃止されました。代わりにCSSを使います。
カテゴリ タグの省略 親要素 子要素
Flowコンテンツ 省略不可 Flowコンテンツを子にできる要素 dtdd
属性 説明
グローバル属性 - -
イベント属性 - -
サンプルコード
<!DOCTYPE html>
<html lang="ja">
  <head>
    <title>マクドエイド</title>
  </head>
  <body>
    <p>マクドエイドの朝のメニューです。</p>
    <dl>
      <dt>ソーセージマフィン</dt>
      <dd>焼きたてのイングリッシュマフィンに香るほのかなバターの風味が特徴です。</dd>
      <dt>エッグマフィン</dt>
      <dd>タマゴのしっとりした感触がチーズと絶妙なハーモニーを奏でます。</dd>
      <dt>ホットドッグ</dt>
      <dd>パリっとした食感がウリのあらびきポークソーセージを使用してます。</dd>
    </dl>
  </body>
</html>
参考文献:W3C HTML5「4.5.8 The dl element」外部リンク
HOME