定義リストを作る際に使用するのが<dl>タグです。
これは少し特殊で、今まではマークや数字などで表示されていた行の始めが任意のテキストになります。
この<dl>を使用してリストを作成すると、以下のようになります。
- タイトル1
- リスト1行目
- タイトル2
- リスト2行目
- タイトル3
- リスト3行目
HTMLは以下のようになります。
<dl> <dt>タイトル1 <dd>リスト1行目 <dt>タイトル2 <dd>リスト2行目 <dt>タイトル3 <dd>リスト3行目 </dl> |
まず、赤文字の【dl】が定義リスト全体を表しています。
<dl>タグはここから定義リストが始まり、</dl>で終わりますよという意味ですが、次の赤文字の【dt】はリストのタイトルを、【dd】はリストの行を意味します。
自分で今作っていて上の<dl>のリストだと、何に使うのかさっぱりわからない感じがしたので、一応使用例を挙げます。
- 一期一会
- 一生に一度しか会う機会のないような縁であること。
- 行雲流水
- ものごとに執着しないで自由な気持ちでいるようす。
- 花鳥風月
- 自然の美しい風物のこと。また、美しい自然を鑑賞する風雅な心のこと。
- 柳緑花紅
- 春の美しい景色のたとえ。自然があるがままで、人の手が加わわっていないようす。また、ものにはそれぞれ自然の理が働いていて、1つ1つ異なっていることのたとえ。
このように、タイトルにここでは四字熟語を入れ、リストの部分でそれを説明するなんていう使用方法や、他にはホームページのメニューで、タイトルに各コンテンツのタイトルを入れリンクを張り、リストにそのコンテンツの説明を入れるといった使用方法もあります。