Jan. 29th,2022
プロパティについて
＃
概要
| 初期値 | “list-style-position: outside;” |
| 適用対象 | リスト・アイテム |
| 継承 | Yes |
| パーセント値 | パーセント値は指定できません |
| 計算値 | 指定されたキーワード |
| アニメーション | 離散 |
“list-style-position”プロパティはリスト・アイテムに付与するリスト・マーカーの表示位置を指定します。
“list-style-position”プロパティはリスト・マーカーを表す“::marker”擬似要素をリスト・アイテムの中に表示するのか、それとも外に表示するのかを指定します。
サンプルコード
ol { list-style-position: outside;}
＃
値
| 値 | 説明 |
|---|---|
| inside | “::marker”擬似要素をリスト・アイテムの最初のインライン・レベルのコンテンツとして表示します |
| outside | 【リスト・アイテムがブロック・コンテナの場合】“::marker”擬似要素はブロック・コンテナとしてプリンシパル・ボックスの外側に表示します (“marker-side”プロパティの指定に従ってインライン・スタート側に表示されますが、具体的な位置については仕様書では定められていません。“::marker”擬似要素はプリンシパル・ボックスのボーダーに固定され、プリンシパル・ボックスのコンテンツがスクロールできる場合でも一緒にスクロールはしません。また、“::marker”擬似要素の大きさはプリンシパル・ボックスの最初の行の高さに影響を与えることがあります。) |
| 【リスト・アイテムがインライン・ボックスの場合】“inside”と同じです | |
| 共通キーワード |
＃
使用例
＃
リスト・マーカーをリスト・アイテムの中に表示する
ol { list-style-position: inside;}
- 富山地方鉄道富山軌道線呉羽線トヨタモビリティ富山 Gスクエア五福前（五福末広町）停留場
- 京福電気鉄道北野線等持院・立命館大学衣笠キャンパス前駅
- 舞浜リゾートラインディズニーリゾートラインリゾートゲートウェイ・ステーション駅
- 舞浜リゾートラインディズニーリゾートライン東京ディズニーランド・ステーション駅
- 南阿蘇鉄道高森線南阿蘇水の生まれる里白水高原駅
- 一畑電車北松江線松江イングリッシュガーデン前駅
- 京浜急行電鉄空港線羽田空港第1・第2ターミナル駅
- 鹿島臨海鉄道大洗鹿島線長者ヶ浜潮騒はまなす公園前駅
- 一畑電車北松江線出雲科学館パークタウン前駅
- 舞浜リゾートラインディズニーリゾートラインベイサイド・ステーション駅
＃
リスト・マーカーをリスト・アイテムの外に表示する
ol { list-style-position: outside;}
- 富山地方鉄道富山軌道線呉羽線トヨタモビリティ富山 Gスクエア五福前（五福末広町）停留場
- 京福電気鉄道北野線等持院・立命館大学衣笠キャンパス前駅
- 舞浜リゾートラインディズニーリゾートラインリゾートゲートウェイ・ステーション駅
- 舞浜リゾートラインディズニーリゾートライン東京ディズニーランド・ステーション駅
- 南阿蘇鉄道高森線南阿蘇水の生まれる里白水高原駅
- 一畑電車北松江線松江イングリッシュガーデン前駅
- 京浜急行電鉄空港線羽田空港第1・第2ターミナル駅
- 鹿島臨海鉄道大洗鹿島線長者ヶ浜潮騒はまなす公園前駅
- 一畑電車北松江線出雲科学館パークタウン前駅
- 舞浜リゾートラインディズニーリゾートラインベイサイド・ステーション駅
