リストを作成する方法 (ul/ol/li) [HTML]

リストを作成する方法

参考：

HTML で箇条書き ul・ol・li タグの使い方まとめ | サルワカ

HTML Lists | W3Schools

ul タグ

項目に黒丸や白丸を付けた順序なしリストを作成する。

参考：

<UL> | HTMLタグリファレンス (htmq.com)

ol タグ

項目に 1, 2, 3, … あるいは a, b, c, … など順に数字やアルファベットを振った順序付きリストを作成する。

参考：

<OL> | HTMLタグリファレンス (htmq.com)

順序付きのリストを作る | TAG index

数字を使ったリスト | Web ページ作りのお勉強

<ol>: 順序付きリスト要素 | MDN

li タグ

参考：

<LI> | HTMLタグリファレンス (htmq.com)

li タグとは｜コーディングのプロが作る HTML タグ辞典

HTML li tag | W3Schools

value 属性

ol タグ内で li タグに value を指定すると、番号付きリストの番号を指定できる。

<ol>
  <li value="2">This is the "2nd" item.</li>
</ol>

参考：

番号付きのリストの途中から番号を変える | HTML タグボード

list-style-type

マーカーの種類を指定する。

• disc：黒丸
• circle：白丸
• square：黒四角
• decimal：算用数字 (1, 2, 3, ...)
• cjk-decimal：漢数字 (一, 二, 三, ...)
• decimal-leading-zero：ゼロを付けた数字 (01, 02, 03, ...)
• lower-roman：小文字のローマ数字 (i, ii, iii, ...)
• upper-roman：大文字のローマ数字 (I, II, III, ...)
• lower-alpha：小文字のアルファベット (a, b, c, ...)
• upper-alpha：大文字のアルファベット (A, B, C, ...)

マーカーなし

list-style-type: none;

参考：

list-style-type | スタイルシートリファレンス (htmq.com)

list-style-type | MDN

括弧付き数字リスト

参考：

ol タグのナンバリングをカッコつきにする – Qiita

リストで括弧付の数字を作る方法 | Web お役立ちネタ帳

HTML の <ol> で 1. ではなく (1) とか 2) とか括弧付きで表示したい場合のメモ | 牌語備忘録

list 要素の marker を括弧付きの数字にする | 株式会社コニファ