HTML講座

箇条書き(List)

順序のある箇条書き:Ordered List

<ol>
<li>項目1</li>
<li>項目2</li>
<li>項目3</li>
</ol>
olの属性
<ol reversed="reversed">
リストの並び順を降順にする
<ol start="数値">
リストの開始番号
使用例:<ol reversed="reversed" start="5">
  1. 項目1
  2. 項目2
  3. 項目3
ol(ul)のスタイル(マーカーの形状)
ol{ list-style:none}
ol{
    list-style:none;
}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:decimal}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:decimal-leading-zero}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:lower-roman}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:upper-roman}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:lower-alpha}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:lower-greek}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:hiragana}
  1. 項目1
  2. 項目2
  3. 項目3
ol{ list-style:katakana-iroha}
  1. 項目1
  2. 項目2
  3. 項目3

順序のない箇条書き:Unordered List

<ul>
<li>項目1</li>
<li>項目2</li>
<li>項目3</li>
</ul>
ul(ol)のスタイル(マーカーの形状)
ul{ list-style:none}
  • 項目1
  • 項目2
  • 項目3
ul{ list-style:disc}
  • 項目1
  • 項目2
  • 項目3
ul{ list-style:circle}
  • 項目1
  • 項目2
  • 項目3
ul{ list-style:square}
  • 項目1
  • 項目2
  • 項目3