簡単ホームページをメモ帳で作ろうよ


第九回:リストの作成に挑戦の巻

<nifty:FROM40PC/MES/11/1383>

<マーク付のリストを書こう> <ul>リスト項目</ul>
 リスト項目には<li>に続けて項目名を書く
簡単な例:
<ul><li>リスト項目1<li>リスト項目2<li>リスト項目3</ul>

このようにタグを記載すると、下のようにブラウザが表示してくれます。つまり、項目を黒丸でリストアップしてくれるわけです。

書き方の基本は、<ul>~</ul>でリストを作成させ、<li>でマーク(黒丸)の付いたリストを作成させています。
このタグを使うと、自動的にインデントされ(先頭から書き始めるのでなく空白が少し挿入されること)、リストの行末も自動改行されます。ですから、改行マーク<BR>を入れる必要はありません。

<ul>
<li type="disk">リスト項目1<li type="disk">リスト項目2
<li type="circle">リスト項目3<li type="circle">リスト項目4
<li type="square">リスト項目5<li type="square">リスト項目6
</ul>

このようにタグを記載すると、こんどは黒丸、四角、白丸で表示されます。


では、今度は、番号付のリストに挑戦です。

<番号付のリストを書こう> <ol>リスト項目</ol>
 リスト項目には<li>に続けて書く
 例:<ol><li>リスト項目1<li>リスト項目2<li>リスト項目3</ol>

<ol>
<li>ひで
<li>にゃんこ
<li>いがちん
<li>みつりん
<li>ほんち
</ol>

このように、ちゃんと番号が付いてリストアップされます。

では、今度は番号付リストを書いて、途中で文章を挿入、その後に続き番号からリストの表示に挑戦してみますね。
途中から番号がちゃんと続くところが味噌ラーメンです。(^_^;

<ol>
<li>ひで
<li>にゃんこ
<li>いがちん
<li>みつりん
<li>ほんち
</ol>
こんなふうにリストを作ってみました。<br>
このあとに、番号を続けてリストを表示してみましょう。<br>
番号はちゃんと続いていますよね。<br>
<ol>
<li value=6>夜郎
<li>Sortie
<li>あしか
<li>中村
<li>まふまふ
</ol>



では次に、番号ではなく、アルファベット順のリストを作ってみます。
<li>の部分を<li type=A>とすれば、アルファベットの大文字リストに、
<li type=a>とすると、アルファベットの小文字リストに、
      <li type=I>とすると、ローマ数字の大文字リストに、(I はアイ)
      <li type=i>とすると、ローマ数字の小文字リストになります。

<ol>
<li type=A>ひで<li type=A>にゃんこ
<li type=a>いがちん<li type=a>みつりん<li type=a>ほんち
</ol>
こんどはアルファベットとローマ数字を使ったリストです。<br>
ちゃんと上から順番になっているのがお分かりですよね。。<br>
<ol>
<li type=I value=6>夜郎<li type=I>Sortie<li type=I>あしか
<li type=i>中村<li type=i>まふまふ
</ol>

なお、NIFTY SERVE会議室内では、もうちょっと詳しく説明しています。
さて、みなさんもリストを聴きながら、リストの作成に挑戦しましせんか。(^_^)

Lesson 1 Lesson 2 Lesson 3 Lesson 4 Lesson 5 Lesson 6 Lesson 7 Lesson 8 Lesson 9 Lesson10
Lesson11 Lesson12 Lesson13 Lesson14 Lesson15 Lesson16 Lesson17 Lesson18 Lesson19 Lesson20
Lesson21 Lesson22 Lesson23 Lesson24 Lesson25 Lesson26 Lesson27 Lesson28 Lesson29 Lesson30

みつりんの簡単ホームページ講座トップ

トップページへ コマンドプロンプト VBAで遊ぼう パレットへ(注) ホームページ道場へ(注)
(注)@nifty会員のみご利用いただけます 30日で完成ホームページ本 ファイルの開き方

Since 15/06/1999
ホームページの内容の転載を禁じます made by mitsurin