list-style-typeのサンプル
list-style
list-styleで数字や、ドットはどれだっけ?てなりますので備忘録として記載いたします。
黒丸
li.hoge{
list-style-type: disc;
}
- サンプル
- サンプル
- サンプル
白丸
li.hoge{
list-style-type: circle;
}
- サンプル
- サンプル
- サンプル
黒四角
li.hoge{
list-style-type: square;
}
- サンプル
- サンプル
- サンプル
小文字のローマ数字
li.hoge{
list-style-type: lower-roman;
}
- サンプル
- サンプル
- サンプル
大文字のローマ数字
li.hoge{
list-style-type:upper-roman;
}
- サンプル
- サンプル
- サンプル
小文字のギリシャ文字
li.hoge{
list-style-type:lower-greek;
}
- サンプル
- サンプル
- サンプル
算用数字
li.hoge{
list-style-type:decimal;
}
- サンプル
- サンプル
- サンプル
先頭に0をつけた算用数字
li.hoge{
list-style-type:decimal-leading-zero;
}
- サンプル
- サンプル
- サンプル
漢数字
li.hoge{
list-style-type:cjk-ideographic;
}
- サンプル
- サンプル
- サンプル
イロハニホヘト順
li.hoge{
list-style-type:katakana-iroha;
}
- サンプル
- サンプル
- サンプル
大文字のアルファベット
li.hoge{
list-style-type:upper-alpha;
}
- サンプル
- サンプル
- サンプル
YubinBangoで複数の住所入力欄に対応する方法:送付先・請求先を自動補完!
7月 3, 2025CSSだけで簡単!画像を白黒→カラーに切り替えるマウスオーバーエフェクト
6月 18, 2025leading-trimとtext-edgeでタイポグラフィを美しく整えるCSSテクニック
6月 15, 2025