listy-style-*プロパティ

list-style-image

リストスタイルの「・」の代わりの画像を指定するプロパティです。

<ul style="list-style-image:url(image/listmark-1.png)">
  <li>test
  <li>test
  <li>test
</ul>

• test
• test
• test

list-style-position

このプロパティはリストマークをボックスの内側か外側どちらかに配置するかを指定します。
プロパティの値はinsideとoutsideがあります。(指定無しの場合はoutside)

指定無し

<ul style="border:1px solid #000">
  <li>test
  <li>test
  <li>test
</ul>

• test
• test
• test

list-style-position: outside

<ul style="list-style-position:outside; border:1px solid #000">
  <li>test
  <li>test
  <li>test
</ul>

• test
• test
• test

list-style-position: inside

<ul style="list-style-position:inside; border:1px solid #000">
  <li>test
  <li>test
  <li>test
</ul>

• test
• test
• test

list-style-type

リストマークの形状を指定するプロパティです。値の種類には「counter-style」「string」「none」の3つがあります。

list-style-typeで指定できるstringタイプのキーワードには以下のものがあります。list-tyle-type: <string>

• disc デフォルトの●型
• circle ○型
• square ■型
• decimal 数字.
• decimal-leading-zero 頭に0をつけた数字
• upper-latin 大文字のアルファベット
• lower-latin 小文字のアルファベット
• upper-alpha 大文字のアルファベット
• lower-greek 小文字のギリシャ文字
• armenian アルメニア
• georgian グルジア
• hebrew ヘブライ
• upper-roman 大文字のローマ数字
• lower-roman 小文字のローマ数字
• upper-cjk-ideographic 漢数字
• hiragana ひらがな
• hiragana-iroha いろは順
• katakana カタカナ
• katakana-iroha イロハ順