WEB技術の辞書・解説・使用例

TOP > HTML >  HTMLタグ辞典 >  <li>
<li>  リスト  定番 

リストの項目を記述するタグ。


<LI>はList Itemの略。<UL>~<UL> または<OL>~<OL>の間に、項目ごとに記述します。

<UL>・・・番号無しリストの場合

<UL>タグは 国語, 数学, 理科 ... のように特に順番を必要としないタイプのリスト。

●TYPE="type"
 circle:白丸
 disc:黒丸
 square:四角

<OL>・・・番号付きリストの場合

<OL>タグは 1.米国 ,2.中国 ,3.日本 ... のように順番を付与するタイプのリスト。

●TYPE="type"
 1:1, 2, 3, 4, 5, ...
 a:a, b, c, d, e, ...
 A:A, B, C, D, E, ...
 i:i, ii, iii, iv, v, ...
 I:I, II, III, IV, V, ...

●value="n"
 value="2" とすると項目番号が 2. になります。
 type="a" の時に項目番号を c. にするときvalue="3" とします。

サンプルコード

<ul>
<li>メニュー1</li>
<li>メニュー2</li>
<li>メニュー3</li>
</ul>

  • メニュー1
  • メニュー2
  • メニュー3

サンプルコード

<ul>
<li>メニュー1</li>
<li type="circle">メニュー2</li>
<li type="disc">メニュー3</li>
<li type="square">メニュー4</li>
</ul>

  • メニュー1
  • メニュー2
  • メニュー3
  • メニュー4

サンプルコード

<ol type="1">
<li>メニュー1</li>
<li>メニュー2</li>
<li>メニュー3</li>
</ol>

  1. メニュー1
  2. メニュー2
  3. メニュー3

サンプルコード

<ol type="a" start="10">
<li>メニュー1</li>
<li>メニュー2</li>
<li value="1">メニュー3</li>
</ol>

  1. メニュー1
  2. メニュー2
  3. メニュー3



HTMLの一般属性

属性説明
class="~"クラス名を指定。使用例
id="~"IDを指定します。使用例
style="~"スタイルシートを直接記述。使用例
title="~"タイトルを指定します。
dir="ltr|rtl"文字の表示方向を指定。 ltr(左から右)、rtl(右から左)
lang="~"言語を指定。日本語の場合は"ja"