文書を作成する上で、箇条書きは欠かせない機能です。HTML4.01でも、[OL],[UL],[DL],[DIR],[MENU]要素など用意されておりますが、 非推奨とされる[DIR],[MENU]要素は割愛させていただきます。
下記実例をご覧ください。
上記の「htmlソース」です。
<ol> <li>ol 要素は「通し番号有りのリスト」を生成します。</li> <li>文章は、[li]～[/li]タグ間に記述します。</li> <li>算用数字、ローマ数字、英文字などが、通し番号で行頭に付きます。</li> <li>種類の選択は自由です。</li> <li>インデントが施されています。</li> <li>新しい[li]タグに移ると自動的に改行されます。</li> <li>改行の[br]タグを使用した場合、文字列は上の行のトップに並び、<br>左に飛び出すことはありません。</li> </ol>
下記実例をご覧ください。
上記の「htmlソース」です。
<ul> <li>ul 要素は「通し番号なしのリスト」を生成します。</li> <li>文章は、[li]～[/li]タグ間に記述します。</li> <li>小さな○、●、■のマークが行頭に付きます。</li> <li>マークの選択は自由です。</li> <li>インデントが施されています。</li> <li>新しい[li]タグに移ると自動的に改行されます。</li> <li>改行の[br]タグを使用した場合、文字列は上の行のトップに並び、<br>左に飛び出すことはありません。</li> </ul>
「通し番号有り リスト」と「通し番号なし リスト」のHTMLソースを比較すると、 冒頭の<>内で[ol]と[ul]を変え、同終了タグを替えただけと言うことがお分かり頂けたかと思います。
ですから、単なる羅列の場合と、序数があった方が良い場合の判断次第でどちらかを選択することになりますが、 HTMLソースでの変更は非常に簡単です。出来上がりを見てから、マーク、序数のタイプの選択を含めて、決めても良いのではないでしょうか。
<!-- Ordered lists (OL) Numbering style
1 arablic numbers 1, 2, 3, ...
a lower alpha a, b, c, ...
A upper alpha A, B, C, ...
i lower roman i, ii, iii, ...
I upper roman I, II, III, ...
The style is applied to the sequence number which by default
is reset to 1 for the first list item in an ordered list.
This can't be expressed directly in SGML due to case folding.
-->
<!ENTITY % OLStyle "CDATA" -- constrained to: "(1|a|A|i|I)" -->
<!ELEMENT OL - - (LI)+ -- ordered list -->
<!ATTLIST OL
%attrs; -- %coreattrs, %i18n, %events --
type %OLStyle; #IMPLIED -- numbering style --
compact (compact) #IMPLIED -- reduced interitem spacing --
start NUMBER #IMPLIED -- starting sequence number --
>
<!-- Unordered Lists (UL) bullet styles -->
<!ENTITY % ULStyle "(disc|square|circle)">
<!ELEMENT UL - - (LI)+ -- unordered list -->
<!ATTLIST UL
%attrs; -- %coreattrs, %i18n, %events --
type %ULStyle; #IMPLIED -- bullet style --
compact (compact) #IMPLIED -- reduced interitem spacing --
>
<要素型は[OL]です。 開始タグ<OL>必須と終了タグ</OL>必須 この[OL]要素の内容モデルは、子要素として [LI] 要素を１回以上出現させなければなりません。 -- ordered list --(順番付け有りリスト)> <!ATTLIST は属性定義 属性を定義する要素の名前 [OL] %attrs; パラメータ実体参照で、別途定義がある属性 -- %coreattrs, %i18n, %events (は、パラメータ実体宣言を参照) -- type %OLStyle; #IMPLIED [属性] -- 番号有りスタイルとして、下記 ５種が決められています。"(1|a|A|i|I)"-- compact (compact) #IMPLIED [属性] -- リストの項目をコンパクトに表示する-- start NUMBER #IMPLIED [属性] -- スタート番号を決める-- >
<要素型は[UL]です。 開始タグ<UL>必須と終了タグ</UL>必須 この[UL]要素の内容モデルは、子要素として [LI] 要素を１回以上出現させなければなりません。 -- unordered list --(順番付けなしリスト)> <!ATTLIST は属性定義 属性を定義する要素の名前 [UL] %attrs; パラメータ実体参照で、別途定義がある属性 -- %coreattrs, %i18n, %events (は、上記参照) -- type %ULStyle; #IMPLIED [属性] -- 番号有りスタイルとして、下記 ３種が決められています。disc|square|circle-- compact (compact) #IMPLIED [属性] -- リストの項目をコンパクトに表示する -- >
注記：[OL]要素[UL]要素に共通していいることは、子要素に[LI]要素しか持たないことです。
また、[OL],[UL],[DL]要素夫々、compact属性があります。
記述は、[ol]要素を例にとると、<ol compact="compact"> か<ol compact>になります。<ol compact>の方が有利な説などもあります。
リストの項目を「コンパクト（最小の面積）に表示する」こととなっているのですが、私のIE6.0では機能しませんでした。
要素型は「LI」です。 開始タグ<li>必須、終了タグ省略可
内容モデル (%flow;)*
%flow; の内容は、ブロック要素とインライン要素を網羅しています。それらが、現れないか、任意回数出現しても良い。
即ち、[LI]要素に、ブロック要素とインライン要素が記述できるということです。
<!ENTITY % flow "%block; | %inline;">パラメータ実体[flow]の宣言を読むと、
(ブロック要素一覧)
<!ENTITY % block
" P | DL | DIV | CENTER |
NOSCRIPT | NOFRAMES | BLOCKQUOTE | FORM | ISINDEX | HR |
TABLE | FIELDSET | ADDRESS">
<!ENTITY % heading " H1 | H2 | H3 | H4 | H5 | H6 ">
<!ENTITY % list " UL | OL | DIR | MENU ">
<!ENTITY % preformatted "PRE">
(インライン要素一覧)
<!ENTITY % fontstyle
" TT | I | B | U | S | STRIKE | BIG | SMALL">
<!ENTITY % phrase " EM | STRONG | DFN | CODE |
SAMP | KBD | VAR | CITE | ABBR | ACRONYM">
となっています。
<!ATTLISTは属性定義、属性を定義する要素の名前 [LI]
%attrs; パラメータ実体参照で、別途定義がある属性 -- %coreattrs, %i18n, %events (は、上記参照) --
type %LIStyle; #IMPLIED [属性] -- 箇条書きリストのスタイル --
%LIStyle;参照すると、下記が現れます。
<!ENTITY % ULStyle "(disc|square|circle)">(ULからも参照有り)
<!ENTITY % OLStyle "CDATA" -- constrained to: "(1|a|A|i|I)" -->(OLからも参照有り)
value NUMBER #IMPLIED -- リセットされた連続番号(の設定） --
>
１：算用数字（標準）
a ：英小文字
A ：英大文字
ⅰ：ローマ数字小文字
Ⅰ：ローマ数字大文字
なお、スタート番号を任意に設定する場合には、OL 要素の start 属性を使用します。
同上をLI要素に設定する場合には、value 属性を使用します。
disc ： 黒丸
square： 黒四角
circle： 白丸
start と type 属性を使い、<ol start="I" type="I">と記述し、以下[li]を続けます。
異なった要素の文章後の<li>タグにvalue属性を付け<li value="3">にします。
途中に<p>タグを使った文章を入れました。
途中で序数を合わせることが出来るのは、算用数字だけのようです。（私のテストでは。）
<ul type="square">と記述します。
下記実例をご覧ください。
上記の「HTMLソース」です。[dl]～[/dl]要素間に記述します。
<dl> <dt>【dl 要素】</dt> <dd>定義リストを作ります。</dd> <dt>【dt 要素】 (定義される言葉)</dt> <dd>dd 要素は、その言葉の意味を説明する欄になります。</dd> <dt>【辞書】</dt> <dd>多くの言葉や文字を一定の基準によって配列し、（以下省略）</dd> <dt>【事典】</dt> <dd>事物や事柄を表す言葉を集めて一定の順序に配列し、（以下省略）</dd> </dl>
DTDでリストに分類される。定義リスト[DL]は、[OL],[UL]が作るリストとは雰囲気が全く異なります。
項目を序数やマークで区別するのではなく、字下げをすることで、項目名を引き立たせています。
<dt>タグで「用語」を示し、<dd>タグで「その記述・解説」をします。上の例でお分かりのように「辞書スタイル」になりますので、
構成は、「用語、記述」、「用語、記述」が繰り返されます。従ってHTML記述は<dt>タグと<dd>タグがセットで繰り返えすことになります。
<!-- definition lists - DT for term, DD for its definition --> <!ELEMENT DL - - (DT|DD)+ -- definition list --> <!ATTLIST DL %attrs; -- %coreattrs, %i18n, %events (は、パラメータ実体宣言を参照)-- compact (compact) #IMPLIED -- reduced interitem spacing -- > <!ELEMENT DT - O (%inline;)* -- definition term --> <!ELEMENT DD - O (%flow;)* -- definition description --> <!ATTLIST (DT|DD) %attrs; -- %coreattrs, %i18n, %events --（は、上記参照） >
要素型は[DL]です。 開始タグ<dl>必須、終了タグ</dl>必須 内容モデル (DT|DD)+ は、 DL要素は1つ以上のDT要素あるいは DD要素を含む必要があるが、その順序は問われない。 (「|」は「いずれか一つ」を表しますので、DT要素かDD要素のいずれか一つになります。 更に、[＋]で１回以上繰り返して良いことになり、その順序は問われないことになります。） ということは、上で「<dt>タグと<dd>タグがセットで」と書きましたが、 <dt><dt><dd>や<dt><dd><dd>の出現でも良いことになります。 <!ATTLISTは属性定義、属性を定義する要素の名前 [DL] %attrs; パラメータ実体参照で、別途定義がある属性 -- %coreattrs, %i18n, %events (は、上記参照) -- compact (compact) #IMPLIED -- リストの項目をコンパクトに表示する-- >
要素型は[DT]です。 開始タグ<dt>必須、終了タグ省略可 内容モデル (%inline;)* は、インライン要素が現れないか、任意回数出現しても良いことを示しています。 要素型は[DD]です。 開始タグ<dd>必須、終了タグ省略可 内容モデル (%flow;)* は、[li]要素と同様で、ブロック要素とインライン要素を網羅しています。 それらが、現れないか、任意回数出現しても良い。即ち、[DD]要素の下に、ブロック要素とインライン要素が 記述できるということです。（参照：上段の[LI]要素のDTD） <!ATTLISTは属性定義、属性を定義する要素の名前 （DT|DD）で、[DT]要素若しくは[DD]要素になります。 %attrs; パラメータ実体参照で、別途定義がある属性 -- %coreattrs, %i18n, %events (詳しくは、上記参照) -- id、class (文書内識別子) lang (言語情報) dir (テキスト方向) title (要素情報) style (行内スタイル情報) onclick、ondblclick、 onmousedown、onmouseup、 onmouseover、onmousemove、 onmouseout、 onkeypress、 onkeydown、onkeyup (組込みイベント) >