ul要素

Home>HTML>要素リファレンス>ul

この情報はお役に立ちましたか?よろしければ皆様にもお知らせください。

  このエントリーをはてなブックマークに追加 mixiチェック  

ul要素の役割

ul要素はリスト表示する要素です。
リスト表示は箇条書きのように、項目の先頭にマーカーを表示します。
ul要素はli要素を内包し、li要素に各項目の内容を記述します。

項目をナンバリングしたい場合にはol要素を使います。

ul要素を使ったときに生じる上下左右のマージンは、CSSのmarginプロパティ及びpaddingプロパティで調整します。

なお、SEOの観点で述べると、リスト項目の数は8つ程度がよいようです。

ul要素に設定できる属性

属性名 意味
class クラス名。CSSを適用するときなどに使用する。
compact 内容をコンパクトに表示する。非推奨。
dir 文字表記の方向。左から右(ltr)と、右から左(rtl)を指定する。通常はltrなので、右から左へ表記する言語を使わないのであれば、指定しなくてよい。
id ID名。CSSを適用するときに使用する。
lang 言語コード。日本語、英語といった言語を指定する。html要素に記述してあれば、明示する必要はない。
style スタイルシートを直接記述する。
title 補足情報。テキストにカーソルを合わせるとtitle属性に指定した文字列をポップアップで表示する。
type リストの項目のマークの種類を指定。非推奨。

ul要素の使い方

<ul>
<li>項目1</li>
<li>項目2</li>
</ul>

  • 項目1
  • 項目2

compact属性

compact属性は、リストの内容をコンパクトに縮小して表示します。ただし、現在対応しているブラウザはありません。また、非推奨属性ですので、内容を狭めて表示したいのであれば、CSSのletter-spacingプロパティなどを使いましょう。

type属性

disc 黒丸。初期値。
circle 白丸。
square 黒の四角。

type属性は非推奨なので、CSSのlist-style-typeプロパティを使いましょう。

関連リンク

よく読まれている記事

UpDate:2010-6-21