ul要素

• 箇條書き。順不同リスト。
• 項目をli要素としてマークアップしたあと、それらの項目が一聯のものである事を示すため、ul要素として全体を括ります。
• liをグループ化する以外の用途には全く使用できません。即ち、ulの直下にはli以外、いかなる要素も出現してはなりません。ただし、HTML 4.01のDTDによれば、ins/del要素を記述出来ます。

汎用属性のclass、id、title、style、lang、dir(、xml:lang)が使用可能です。

Mozilla Classic(4.x以前のNetscape Navigator)の誤った実装

Cascading Style Sheetsの指定で、ul要素の左マージンを0と指定しても、Mozilla Classicは、勝手に左マージンを附けてHTML文書を整形します。左マージンの値を0以上に指定すると、Mozilla Classic固有のスタイルシートのデフォルト値に指定された数値を加算して、HTML文書を整形します。

Mozilla Classicは「HTML文書を頭から読込み、出現したタグによつて、続いて出現する文字列の位置を決定してゐるのではないか」と推測される所以です。

また、このMozilla Classicの挙動を誤解して、「ulは文字列の左に隙間を開けるためのもの」と信じて、ulの直下にテキストを記述する人があります。けれども、「文字列の左に隙間を開ける」目的のためにol/ul/dlなる3つの要素が存在すべき必然性は存在しませんし、それらの中から特定の一つを選び取り、他の二つを排除しなければならない理由も全く存在しません。要は、その信念が誤です。

リスト?

厳密な意味で「リスト」である必要はありません。何かを列挙する場合には、何であれ「リスト」として表現する事が可能です。

メニュー・「パン屑リスト」

「ぺーじ」のメニュー(所謂「パン屑リスト」)では従来、アンカーを並べる時、「|」で区切る、等のやり方がとられて来ました。しかし、それぞれのアンカーをliの中に括り、全体をulで括る、といったやり方で「リスト化」する方法が昨今、一般化しつつあります。

ul-liで表現された「メニュー」ですが、CSSによって従来の様な見た目にする事ができます。

画像

取敢ず画像を一枚、imgで「ぺーじ」に埋込む時、「それだけ」ではinvalidになる、といった理由で「imgだけをpやdivで括る」事がありました。

これに関しても、「ul-liの中に括る」といった表現が妥当ではないか、と主張しておきます。

<ul>
<li><img src="futaba.jpg" alt="ふたばちゃん"></li>
</ul>

ちょっと異様に見えるかも知れませんが、以下の記述と比較して見て下さい。

<ul>
<li><img src="futaba.jpg" alt="ふたばちゃん"></li>
<li><img src="garkun.jpg" alt="ガーゴイル"></li>
<li><img src="kazumi.jpg" alt="かずみ"></li>
</ul>

「下」の記述が「画像の列挙」の表現として妥当であるならば、「上」の記述も「一枚の画像」の表現として妥当であると言って良いのではないですか。