1999.8.11水NEW
Making of ZK

入門HTML講座

目次 1.HTMLの基本 2.ハイパーリンク 3.ページとテキスト 4.画像 5.リスト 6.テーブル 前ページ 次ページ

5. リスト

　リストとは、「箇条書き］のことで、項目を書き並べる文章構造です。 項目に番号を付けるか付けないかで、「順序付きリスト」と「順序なしリスト」 があります。また、用語の説明を記述する「定義型リスト」というスタイルもあります。

5.1 順序付きリスト

　箇条書きにした項目に番号を付ける場合は、「順序付きリスト（Ordered List）」 を使用します。このリストでは、箇条書きの範囲を<OL> タグと</OL>タグで囲みます。 その中に、「項目（List Item）」を、<LI> タグで記述します。<LI>タグの終了タグは省略が可能で、 一般に、省略した書き方が多いようです。また箇条書きなので、 <BR>タグは必要ありません。項目ごとに、改行します。
　属性の指定を行わない場合は、項目に「算用数字」で「１」番から番号が振られます。 途中の番号から並べたい場合は、<OL>タグに START属性を記述して、開始番号を指定することができます。 また、番号の種類は、TYPE属性を記述して、 "英大文字"，"英小文字"，"大文字ローマ数字"，"小文字ローマ数字"，"算用数字" のいずれかを選択します。
　開始番号と番号の種類は、項目ごとに<LI> タグで指定することもできます。 その場合、開始番号の指定は、VALUE属性で、 番号の種類は、TYPE属性で記述します。

●リスト（list）順序付きリスト
<OL 属性="..."> … 順序付きリスト（Ordered List）
属　性 START="n" 　　〔項目の開始番号〕
TYPE="1／A／a／I／i" 　　〔番号の種類：算用数字／英大文字／英小文字
　　　　／大文字ローマ数字／小文字ローマ数字〕
<LI 属性="..."> … リスト項目（List Item）
属　性 VALUE="n" 　　〔項目の番号〕
TYPE="1／A／a／I／i" 　　〔番号の種類：算用数字／英大文字／英小文字
　　　　／大文字ローマ数字／小文字ローマ数字〕

　サンプル「s151lst.html」で、さまざまな項目番号の指定を確認しましょう。

サンプル 5-1 s151lst.html（順序付きリスト）
<HTML>
<HEAD>
  <TITLE>絶景倶楽部【入門HTML講座】</TITLE>
</HEAD>
<BODY>
<H2 ALIGN="Center">入門HTML講座</H2>
<H3>リスト（List）…順序付きリスト（Ordered List）</H3>
<P><B>《OL 属性なし》</B>
<OL>
  <LI>○○○○
  <LI>××××
  <LI>△△△△
</OL>
<P><B>《OL START="5"》</B>
<OL START="5">
  <LI>◇◇◇◇
  <LI>□□□□
</OL>
<P><B>《OL TYPE="A"》</B>
<OL TYPE="A">
  <LI>○○○○
  <LI>××××
  <LI>△△△△
</OL>
<P><B>《OL START="5" TYPE="a"》</B>
<OL START="5" TYPE="a">
  <LI>◇◇◇◇
  <LI>□□□□
</OL>
<P><B>《OL TYPE="I"》</B>
<OL TYPE="I">
  <LI>○○○○  <LI>××××  <LI>△△△△
</OL>
<P><B>《OL START="5" TYPE="i"》</B>
<OL START="5" TYPE="i">
  <LI>◇◇◇◇  <LI>□□□□
</OL>
</BODY>
</HTML>
このリストを表示する （新しいウィンドウを開きます。参照後は、自分で閉じて下さい。）

　項目番号の指定は、項目ごとにできるので、一つのリストの途中で変更することもできます。

サンプル 5-2 s152lst.html（順序付きリスト-項目番号）
<HTML>
<HEAD>
  <TITLE>絶景倶楽部【入門HTML講座】</TITLE>
</HEAD>
<BODY>
<H2 ALIGN="Center">入門HTML講座</H2>
<H3>リスト（List）…順序付きリスト２</H3>
<P><B>《OL 属性なし》</B>
<OL>
  <LI>○○○○…《LI 属性なし》
  <LI>××××
  <LI VALUE="5">○○○○…《LI VALUE="5"》←(5番目）
  <LI>××××
  <LI TYPE="A">○○○○…《LI TYPE="A"》←(7番目）
  <LI>××××
  <LI TYPE="a">○○○○…《LI TYPE="a"》←(9番目）
  <LI>××××
  <LI TYPE="I">○○○○…《LI TYPE="I"》←(11番目）
  <LI>××××
  <LI TYPE="i">○○○○…《LI TYPE="i"》←(13番目）
  <LI>××××
</OL>
</BODY>
</HTML>
このリストを表示する （新しいウィンドウを開きます。参照後は、自分で閉じて下さい。）

目次 1.HTMLの基本 2.ハイパーリンク 3.ページとテキスト 4.画像 5.リスト 6.テーブル 前ページ 次ページ
--> 【Making of ZK】へ