最終更新日

list-style-positionプロパティ

list-style-positionは、リストの先頭に表示するマーカーの位置を指定するプロパティです。

値はキーワードで指定します。初期値は「outside」で、マーカーはブロックボックスの外側に配置されます。「inside」を指定すると、マーカーはブロックボックスの内側に配置されます。

CSS3ではさらに、「hanging」というキーワードも指定可能です。その場合、マーカーは「inside」と同様、ブロックボックスの内側に配置されますが、マーカーの領域の大きさが同一に揃えられます。

リスト関連のプロパティをまとめて指定する場合は、list-styleを使用します。

CSS3での変更点
・値に「hanging」が追加されました。
初期値 適用先 継承
outside display: list-item;」を指定された要素 あり
説明
outside マーカーはブロックボックスの外側に配置されます。(初期値
inside マーカーはブロックボックスの内側に配置されます。
hanging マーカーは「inside」と同様、ブロックボックスの内側に配置されますが、マーカーの領域の大きさが同一に揃えられます。
サンプルコード
list-style-position: outside;
list-style-position: inside;
list-style-position: hanging;
参考文献:CSS Lists and Counters Module Level 3外部リンク
HOME