15【技術】リスト系のタグ
白猿
「今回はリスト系のタグを紹介しよう。こういうのがあるぜ。なお、liタグはulタグやolタグの中で使うものだ。dl/dt/ddは、この３つをいっしょに使うぜ」
<ul></ul> , <ol></ol> , <li></li> , <dl></dl> , <dt></dt> , <dd></dd>
黒猫
「ふむ。ulとolは箇条書きにするものだったかな」
白猿
「そうそう。まずはulタグを紹介する。ulタグは『unordered list（順序がないリスト）』の略だな。行頭に『・』のような記号をつけた箇条書きになる」
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の入力内容]
<ul>
<li>ULタグは箇条書きで使うもので、通し番号がありません。</li>
<li>箇条書きの前後を<ul></ul>で挟みます。</li>
<li>箇条書きの各行を<li></li>で挟みます。</li>
<li>閉じタグ</li>はなくても機能します。</li>
</ul>
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の表示例]
・゜゜・*:.。..。.:*・゜゜・*:.。
白猿
「こんなふうに、それぞれの行の左端にマークがついて、箇条書きになるんだ」
黒猫
「これならタグを使わずに、自分で行頭に中点『・』を書いて箇条書きをしてもいいよね」
白猿
「そうかもな。次にolタグを紹介する。olタグは『ordered list（順序のあるリスト）』の略だな。行頭に1.2.3.のような数字の箇条書きになる」
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の入力内容]
<ol>
<LI>OLタグは箇条書きで使うもので、通し番号がつきます。</li>
<LI>箇条書きの前後を<ol></ol>で挟みます。</li>
<LI>箇条書きの各行の先頭に<li>をつけます。</li>
<li>閉じタグ</li>はなくても機能します。</li>
</ol>
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の表示例]
・゜゜・*:.。..。.:*・゜゜・*:.。
白猿
「こんなふうに、それぞれの行の左端に番号がつくんだ」
黒猫
「これもタグを使わずとも、自分で数字を書いてもいいよね」
白猿
「では、次はdlタグを紹介する。dlは『definition list（定義）』の略で、言葉の説明をするタグだ。対処の言葉をdtタグで挟む。これは『Definition Term(用語)』の略だ。説明文はddタグで挟む。こいつは『Definition Description(用語の描写)』の略だぜ。利用例を見てみよう」
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の入力内容]
<dl>
<dt>ＤＬタグ</dt>
<dd>DLタグは用語説明などで使うものです。<BR>
用語説明の前後を<dl></dl>で挟みます。<BR>
紹介する用語を<dt></dt>で挟みます。<BR>
用語の説明を<dd></dd>で挟みます。
</dd>
<dt>割烹</dt>
<dd>活動報告の愛称。<BR>
活動報告⇒活報⇒割烹となっている。
</dd>
</dl>
・゜゜・*:.。..。.:*・゜゜・*:.。
[記事の表示例]
・゜゜・*:.。..。.:*・゜゜・*:.。
黒猫
「記事の中で言葉を説明するシーンがあれば使えるかな。ところで上の表示例では、ulとolも含めて、行間が開きすぎているように見えるが？」
白猿
「あ、しまった。活動報告では改行でbrタグがいらないんだ。これで余分に改行されたようだな。実際に使う時はbrを外してくれ。ランキングタグで改行する時はbrが必要だけどね」
黒猫
「今回紹介したリスト系のタグは、無理にタグを使わなくても記事はかけるよね」
白猿
「まぁ、うまく使えば見栄えがよくなるかもよ」
