HTML・HTMLリファレンス・WEBやぁ、やっと水泳で2km泳げるようになったユトピ(@yutopi60pa)だよ。前回のHTMLタグリファレンスでは「リストタグ」についてみていきましたね。ulタグやらolタグ、liタグの特徴や使いかたなんかを見ていきましたね。・あなたは正しくできてる?「リストタグ」を使って分かりやすい箇条書きを作ろう!実はリストタグはこれだけじゃないんです。一つ大事なものがあります。Listの略で、定義リストを作成する際に使用するタグです。定義リストを作る場合はdlタグ以外にも、dtタグ、ddタグを使ってリストを作成していきます。定義リストとはなんぞや?確かに。難しい言葉を使うなよって感じですね。要するにリストの項目ごとに「説明文」を追加することができるのがdlタグのいう定義リストのことです。歴史上の人物を並べたリストに、一人一人の説明を項目ごとに付け加えていくことができます。ulタグやolタグはただ項目を並べるだけでしたよね。これがdlタグの特徴です。<dd>2000年~2001年放送。主演はオダギリジョー。<dd>2001年~2002年放送。<dd>2002年~2003年放送。<dd>2003年~2004年放送。<dd>2006年~2005年放送。</dl>12345678910111213HTML<dl><dt>仮面ライダークウガ</dt><dd>2000年~2001年放送。主演はオダギリジョー。</dd><dt>仮面ライダーアギト</dt><dd>2001年~2002年放送。</dd><dt>仮面ライダー龍騎</dt><dd>2002年~2003年放送。</dd><dt>仮面ライダー555</dt><dd>2003年~2004年放送。</dd><dt>仮面ライダー剣</dt><dd>2006年~2005年放送。仮面ライダークウガ2000年~2001年放送。主演はオダギリジョー。仮面ライダーアギト2001年~2002年放送。仮面ライダー龍騎2002年~2003年放送。仮面ライダー5552003年~2004年放送。仮面ライダー剣2006年~2005年放送。このようにしてdlタグを使っていきます。全体を囲むdlタグ、項目の名前を囲むdtタグ、その説明をddタグが囲っていますね。ちなみにdlタグはulタグやolタグにあったマーカーは付きません。type属性はもちろん、CSSプロパティの「list-style」を使っても何も表示されません。リストタグの属性とlist-styleプロパティではリストタグのようにマーカーを表示したい場合はどうすればよいのでしょうかね?それはまた次回だ!!ちょっと待ってて!ちなみにdlタグでは、dhタグに対して複数のddタグを付け加えることもできます。</dl>123456789101112131415161718192021HTML<strong>アメコミのヒーローたち!</strong><dl><dt>アベンジャーズ</dt><dd>キャプテン・アメリカ</dd><dd>アイアンマン</dd><dd>ハルク</dd><dd>ソー</dd><dd>ホークアイ</dd><dd>ブラックウィドウ</dd></dl><dl><dh>ジャスティスリーグ</dh><dd>スーパーマン</dd><dd>バットマン</dd><dd>ワンダーウーマン</dd><dd>アクアマン</dd><dd>フラッシュ</dd><dd>グリーンランタン</dd><dd>サイボーグ</dd></dl>結果HTMLアメコミのヒーローたち!アベンジャーズキャプテン・アメリカアイアンマンハルクソーホークアイブラックウィドウジャスティスリーグスーパーマンバットマンワンダーウーマンアクアマンフラッシュグリーンランタンサイボーグこんな感じでdlタグを使うことができます!使い勝手は非常に多いので、是非とも使っていきましょう!まとめ以上がdlタグの解説です。定義リストなんて難しそうな名前でしたが、使ってみると意外と単純なことがわかりますよね。コメントをキャンセルメールアドレスが公開されることはありません。