<dl>要素内に<div>要素を使ってみる

1. このページの目的

<dl>要素内に<div>要素を使ってみる。

2. デモ

普通の dl, dt, dd 要素を使う

コード

<dl>
 <dt> Authors
 <dd> John
 <dd> Luke
 <dt> Editor
 <dd> Frank
</dl>

結果

Authors
John
Luke
Editor
Frank

div 要素を使う

特定の定義項目だけに、CSSクラスをあてることができる。

コード

<dl>
  <div>
    <dt> Last modified time </dt>
    <dd> 2004-12-23T23:33Z </dd>
  </div>
  <div class="red">
    <dt> Recommended update interval </dt>
    <dd> 60s </dd>
  </div>
  <div>
    <dt> Authors </dt>
    <dt> Editors </dt>
    <dd> Robert Rothman </dd>
    <dd> Daniel Jackson </dd>
  </div>
  <div>
    <dt>説明</dt>
    <dd>第61期王位戦予選（主催：新聞三社連合）藤井聡太七段―出口若武四段が12月17日に大阪・関西将棋会館で行われ、藤井七段が97手で勝って、予選ブロックの決勝へ進みました。(<a href="https://headlines.yahoo.co.jp/hl?a=20191218-00000010-mynavin-soci" target="_blank" rel="noopener">引用元</a>)</dd>
    <dd>公益財団法人「日本数学検定協会」の数学検定１級に、兵庫県西宮市の小学４年生、安藤匠吾（しょうご）君（９）が史上最年少で合格した。１級は理数系大学卒業程度の力が必要な最難関レベル。これまで合格者の最年少記録は１１歳だったが、匠吾君が一気に２歳更新した。(<a href="https://headlines.yahoo.co.jp/hl?a=20191219-00000005-asahi-soci" target="_blank" rel="noopener">引用元</a>)</dd>
  </div>
</dl>

結果

Last modified time
2004-12-23T23:33Z
Recommended update interval
60s
Authors
Editors
Robert Rothman
Daniel Jackson
説明
第61期王位戦予選（主催：新聞三社連合）藤井聡太七段―出口若武四段が12月17日に大阪・関西将棋会館で行われ、藤井七段が97手で勝って、予選ブロックの決勝へ進みました。(引用元)
公益財団法人「日本数学検定協会」の数学検定１級に、兵庫県西宮市の小学４年生、安藤匠吾（しょうご）君（９）が史上最年少で合格した。１級は理数系大学卒業程度の力が必要な最難関レベル。これまで合格者の最年少記録は１１歳だったが、匠吾君が一気に２歳更新した。(引用元)

参考