各種マーカー(リスト) 【list-style-type】

※ブラウザで表示した時の見え方

カレーの材料 作り方

※ソースサンプル

【CSS】
.list {
list-style-type: circle;
font-size: 11pt
}
.list2 {
list-style-type: decimal;
font-size: 11pt
}
【HTML】
<strong>カレーの材料</strong>
<ul class="list">
<li>牛肉</li>
<li>じゃがいも</li>
<li>玉葱</li>
<li>人参</li>
</ul>

<strong>作り方</strong>
<ul class="list2">
<li>材料を切る。</li>
<li>炒める。</li>
<li>水入れる。</li>
<li>煮る。</li>
<li>出来上がり。(笑)</li>
</ul>

[ 黒※説明中のタグ 紫※省略可能なタグ 赤※変更可能 緑※文章など ]

※解説

オプション
noneリストのマークなしlist-style-type: none
disc黒丸list-style-type: disc
circle白丸list-style-type: circle
square黒い四角list-style-type: square
decimal1.(数字)list-style-type: decimal
lower-romani.(小文字ローマ字数字)list-style-type: lower-roman
upper-romanI.(大文字ローマ字数字)list-style-type: upper-roman
lower-alphaa.(小文字アルファベット)list-style-type: lower-alpha
機能