next up previous index
Next: 4.10 ブロックテキスト Up: 4. HTMLの骨格 Previous: 4.8 コメント


4.9 リスト環境

HTMLの箇条書き(リスト)を使うと、自動連番や見やすい項目表現などができます。dirdlmenuolulの5つが用意されています。

dir[Transitional]
<dir attributes...>〜</dir>は、ディレクトリリストを作成します。リストのそれぞれはliタグに続けて記述します。このタグ環境は推奨されていません。代わりにulタグを使うよう推奨されています。attributesには次のものが入ります。
class
[Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
dir
[Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Transitional][省略可]title="titlename"は補助用タイトルを指定します。
dl[Strict][Transitional]
<dl atrributes...>〜</dl>は、項目と説明がセットになった説明付きリストを作成します。リストの項目はdtタグを使って表現します。その説明はddタグを使って表現します。dtタグとddタグの数は一致していなくてもかまいません。どちらかを省略することも可能です。 attributesには次のようなものが入ります。
class
[Strict][Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
dir
[Strict][Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Strict][Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Strict][Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Strict][Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Strict][Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Strict][Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Strict][Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Strict][Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Strict][Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Strict][Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Strict][Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Strict][Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Strict][Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Strict][Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Strict][Transitional][省略可]title="titlename"は補助用タイトルを指定します。
dtタグ、ddタグの説明は次のとおりです。
dt[Strict][Transitional]
<dt attributes...>〜[</dt>]の形で、説明付きリストの項目を指定します。attributresには次のようなものが入ります。
class
[Strict][Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
dir
[Strict][Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Strict][Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Strict][Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Strict][Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Strict][Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Strict][Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Strict][Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Strict][Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Strict][Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Strict][Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Strict][Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Strict][Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Strict][Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Strict][Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Strict][Transitional][省略可]title="titlename"は補助用タイトルを指定します。
dd[Strict][Transitional]
<dd attributes...>〜[</dd>]の形で、説明付きリストの説明部分を指定します。attributesdtタグと同じです。
menu[Transitional]
<menu attributes...>〜</menu>は、メニューリストを作成します。リストのそれぞれの項目はliタグに続けて記述します。このタグは推奨されていません。代わりにulタグを使うよう推奨されています。attributesには次のものが入ります。
class
[Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
dir
[Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Transitional][省略可]title="titlename"は補助用タイトルを指定します。
ol[Strict][Transitional]
<ol attributes...>〜</ol>は、番号付きリストを作成します。番号は通常、1.から自動的に振られます。リストのそれぞれはliタグに続けて記述します。アトリビュートにより、いくつかの変更が可能です。
class
[Strict][Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
compact
[Transitional][省略可]compact をタグのアトリビュートに入れると、リストの先頭に空ける空白を狭くします。
dir
[Strict][Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Strict][Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Strict][Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Strict][Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Strict][Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Strict][Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Strict][Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Strict][Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Strict][Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Strict][Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Strict][Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Strict][Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Strict][Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
start
[Transitional][省略可]start="number"に数値を入れることで、リスト項目に振る最初の番号を変更できます。
style
[Strict][Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Strict][Transitional][省略可]title="titlename"は補助用タイトルを指定します。
type
[Transitional][省略可]type="type"は、リスト番号の連番に使う文字を指定します。値には次のようなものを取ることができます。
  • 1:1,2,3,...と数字で振ります(デフォルト)。
  • A:A,B,C,...と英大文字で振ります。
  • a:a,b,c,...と英小文字で振ります。
  • I:I,II,III,...と大文字ローマ数字で振ります。
  • i:i,ii,iii,...と小文字ローマ数字で振ります。
ul[Strict][Transitional]
<ul attributes...>〜</ul>は、番号なしリストを作成します。リストのそれぞれの項目はliタグに続けて記述します。リストの先頭の印を変えることもできます。
class
[Strict][Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
compact
[Transitional][省略可]compact をタグのアトリビュートに入れると、リストの先頭のスペースを狭くします。
dir
[Strict][Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Strict][Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Strict][Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Strict][Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Strict][Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Strict][Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Strict][Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Strict][Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Strict][Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Strict][Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Strict][Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Strict][Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Strict][Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Strict][Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Strict][Transitional][省略可]title="titlename"は補助用タイトルを指定します。
type
[Transitional][省略可]type="type"は、リスト項目の先頭に付く印を変更します。値には次のようなものがあります。
  • disc:塗りつぶし円
  • circle:円(中を塗らない)
  • square:正方形(中を塗らない)
なお、Netscape Navigator/Communicatorでは、ulタグの中にさらにulタグがある、という入れ子の深さによってこの印が次のように自動的に変わります。
  1. 塗りつぶし円
  2. 円(中を塗らない)
  3. 正方形(中を塗らない)、以降の入れ子は全部この印

リストの例を次に示しましょう。


<ul>
 <li>イソターネットとは
 <ol>
   <li>うぇっぶ
   <li>世界へ情報発信
 </ol>
</ul>
<dl>
 <dt>マノレチメディア
 <dd>CD-ROMとMPEG
</dl>

このソースから、次のようにブラウザ上に表示されます。


マノレチメディア
CD-ROMとMPEG

dlタグ環境内以外では、リストの項目の定義にliタグを使います。アトリビュートを付けることで、リスト環境の型や値を変更することもできます。

li[Strict][Transitional]
<li attributes...>〜[</li>]の形でリスト項目を定義します。
class
[Strict][Transitional][省略可]class="cdata"は、タグ内のテキストへセットする情報をクラスの形で指定します。詳細は5 を参照してください。
dir
[Strict][Transitional][省略可]dir="direction"は、テキストの方向を指定します。詳細は4.3 を参照してください。
id
[Strict][Transitional][省略可]id="name"は、このタグに固有のIDを振ります。
lang
[Strict][Transitional][省略可]lang="language"は、ドキュメントの言語を指定します。詳細は4.3 を参照してください。
onclick
[Strict][Transitional][省略可]onclick="script"はクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
ondblclick
[Strict][Transitional][省略可]ondblclick="script"はダブルクリックされたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeydown
[Strict][Transitional][省略可]onkeydown="script"はキーを押して離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeypress
[Strict][Transitional][省略可]onkeypress="script"はキーを押したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onkeyup
[Strict][Transitional][省略可]onkeyup="script"はキーを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousedown
[Strict][Transitional][省略可]onmousedown="script"はマウスのボタンをクリックしたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmousemove
[Strict][Transitional][省略可]onmousemove="script"はマウスを移動したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseout
[Strict][Transitional][省略可]onmouseout="script"はマウスを対象から離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseover
[Strict][Transitional][省略可]onmouseover="script"はマウスを対象に当てたときに実行するスクリプトを指定します。詳細は15 を参照してください。
onmouseup
[Strict][Transitional][省略可]onmouseup="script"はマウスのボタンを離したときに実行するスクリプトを指定します。詳細は15 を参照してください。
style
[Strict][Transitional][省略可]style="cdata"は、このタグ内のスタイルを設定します。詳細は5 を参照してください。
title
[Strict][Transitional][省略可]title="titlename"は補助用タイトルを指定します。
type
[Transitional][省略可]type="type"は、リスト番号の文字を指定します。値には次のようなものを取ることができます。
  • 1:1,2,3,...と数字で振ります(デフォルト)。
  • A:A,B,C,...と英大文字で振ります。
  • a:a,b,c,...と英小文字で振ります。
  • I:I,II,III,...と大文字ローマ数字で振ります。
  • i:i,ii,iii,...と小文字ローマ数字で振ります。
value
[Transitional][省略可]olタグ環境のみ意味を持つアトリビュートで、value="number"に値を入れると現在の項目に付けられる番号を変更します。


next up previous index
Next: 4.10 ブロックテキスト Up: 4. HTMLの骨格 Previous: 4.8 コメント
Kenshi Muto
平成11年9月19日