リスト

トップ > 逆引きリファレンス > リスト

リスト(箇条書き)を書くには

リストを表示するには <ul><ol> を用います。<ul> は順序無しリスト(Unorderd List)を意味します。

HTML
<ul>
<li>カレーライス
<li>スパゲティ
</ul>
表示

<ol> は順序リスト(Orderd List)を意味します。

HTML
<ol>
<li>カレーライス
<li>スパゲティ
</ol>
表示
  1. カレーライス
  2. スパゲティ

リスト先頭のマークや数値を変えるには

リストの先頭の丸や数字の部分を変更するには、<ol><ul><li> に type 属性を指定します。

HTML
<ol type="a">
<li>おでん
<li>うどん
</ol>
表示
  1. おでん
  2. うどん

type 属性には次のようなものがあります。

【リストの先頭マーク】
タグ説明
<ol type="1">1, 2, 3, 4, 5, ...(既定値)
<ol type="a">a, b, c, d, e, ...
<ol type="A">A, B, C, D, E, ...
<ol type="i">i, ii, iii, iv, v, ...
<ol type="I">I, II, III, IV, V, ...
<ul type="disc">
  • 黒い丸(既定値)
<ul type="circle">
  • 白い丸
<ul type="square">
  • 黒い四角

ただし、type属性は HTML5 では廃止され、代わりにスタイルシートの list-style-typelist-style-image を使用することが推奨されています。

HTML
<ol style="list-style-type:lower-alpha">
<li>おでん
<li>うどん
</ol>
表示
  1. おでん
  2. うどん

Internet Explorer でフォントサイズを小さくしている場合は、type=disc と type=square の区別がつかないことがあるので注意してください。

定義リストを書くには

用語のその説明の組みからなる定義リストを書くには、<dl><dt><dd> を用います。</dt>、</dd> の終了タグは省略可能です。

<dl>
<dt>HTML</dt>
<dd>HTMLとは・・・</dd>
<dt>CSS</dt>
<dd>CSSとは・・・</dd>
</dl>
HTML
HTMLとは・・・
CSS
CSSとは・・・

Copyright (C) 2003 杜甫々
初版: 2003年10月12日
http://www.tohoho-web.com/how2/list.htm