モックン☆彡の部屋

リスト表示する（低）

リスト表示する（低）

今回使うタグ
< UL >< LI ></ LI ></ UL > 、 < OL >< LI ></ LI ></ OL >

リスト表示とは、主に項目を整理して表示したい場合に使います。

特徴としては、上下にスペースが空き、項目毎にマークが付いて表示されたり、

改行タグ < BR > を使わなくても、自動的に改行される所です。

《例題１》

実際に書くもの

結果

< UL >
< LI > 適当な文章１ </ LI >
< LI > 適当な文章２ </ LI >
< LI > 適当な文章３ </ LI >
</ UL >

適当な文章１
適当な文章２
適当な文章３

これが一番オーソドックスなリストの表示です。

リスト表示したい物の一番最初に < UL > を書いて、

そのあとにリスト項目に書きたいものを < LI > と </ LI > で挟んであげます。

そして最後に </ UL > を書いてタグを閉じてあげます。

このリストタグもテーブルタグと同じようにタイトルをつける事ができます。

書く順番は < UL > の後に書き、タイトルを < LH > と </ LH > で挟んであげます。

そして、これを使ったのが下の 《例題２》 になります。（楽天使用不可）

《例題２》

実際に書くもの

結果

< UL >
< LH > タイトル </ LH >
< LI > 適当な文章１ </ LI >
< LI > 適当な文章２ </ LI >
< LI > 適当な文章３ </ LI >
</ UL >

タイトル

適当な文章１
適当な文章２
適当な文章３

次に、今までリスト表示していた文章の横へ『 • 』が付いていますが、

この記号を下のように変えることができます。

《例題３》

実際に書くもの

結果

< UL >
< LI Type=" disk " > 適当な文章１ </ LI >
< LI Type=" circle " > 適当な文章２ </ LI >
< LI Type=" square " > 適当な文章３ </ LI >
</ UL >

適当な文章１
適当な文章２
適当な文章３

[注意] 例題では対応を分かりやすくするため、色をつけています

『 < LI 』の後に半角のスペースを入れて、『 Type="" 』を書き、その中へ

『 disk 、 circle 、 square 』のいずれかを入れると、それぞれ右に対応した結果になります。

結果で分かるように、『 disk 』は書いても書かなくても変わらないですね。

《例題４》

実際に書くもの

結果

< OL >
< LI > 適当な文章１ </ LI >
< LI > 適当な文章２ </ LI >
< LI > 適当な文章３ </ LI >
< LI > 適当な文章４ </ LI >
< LI > 適当な文章５ </ LI >
</ OL >

適当な文章１
適当な文章２
適当な文章３
適当な文章４
適当な文章５

ここまでくると少し本格的なリストに見えますね。

『 < UL > 、 </ UL > 』と書いていたものを、『 < OL > 、 </ OL > 』と変更しただけで番号が付きます。

しかも、この番号は上から順番に（自動的に）数が割り当てられます。

《例題５》

実際に書くもの

結果

< OL Start="10" >
< LI > 適当な文章１ </ LI >
< LI > 適当な文章２ </ LI >
< LI > 適当な文章３ </ LI >
< LI > 適当な文章４ </ LI >
< LI > 適当な文章５ </ LI >
</ OL >

適当な文章１
適当な文章２
適当な文章３
適当な文章４
適当な文章５

普通に書くと順番に付く番号も、上のように『 Start="10" 』を入れることによって、

開始する番号が変わりますし、途中から番号を変えたい場合は下のようにできます。

実際に書くもの

結果

< OL Start="10" >
< LI > 適当な文章１ </ LI >
< LI > 適当な文章２ </ LI >
< LI Value="5" > 適当な文章３ </ LI >
< LI > 適当な文章４ </ LI >
< LI > 適当な文章５ </ LI >
</ OL >