×

[PR]この広告は3ヶ月以上更新がないため表示されています。
ホームページを更新後24時間以内に表示されなくなります。

marker-offset 【リストマーカーに関する指定】

なし

marker-offsetプロパティは、displayプロパティのmarker値の指定された要素に対して有効です。
リストマーカーは、『display: marker』の要素に対して、基本ボックスの外側に、行ボックスとして生成されます。このボックスはpaddingborderを持ちますが、marginを持ちません。そのため、『list-style-position』と『marker-offset』を使ってで指定主要ボックスとの距離を調節します。
display: marker;は、擬似要素【:before】か【:after】をセレクタとして指定し、それ以外のセレクタに対しては、'display: inline' と等しくなります。セレクタにマッチした対象のマーカボックスと基本ボックスの距離を指定します。

auto
自動的に感覚が指定されます。

数値で指定する
任意の単位に数値を付けて指定します。使える単位

inherit
継承する

marker-offsetの使用例

CSSファイル

.sample001 {
 list-style: disc inside;
 margin: 10px;
}
li:before {
 display: marker;
 marker-offset: 10px;
}

HTMLソース

<ul class="sample001">
<li>リストスタイル1</li>
<li>リストスタイル2</li>
<li>リストスタイル3</li>
</ul>

表示すると

  • リストスタイル1
  • リストスタイル2
  • リストスタイル3

リスト関連項目

list-style マーカーに関する指定をまとめて行う 
list-style-type マーカー文字の種類を指定する 
list-style-image マーカー画像を指定する 
list-style-position マーカーの表示位置を指定する 
marker-offset※ マーカーとの間隔を指定する 

戻る

TOP

WEB SEARCH
MENU
CONTENTS
digilog.TOP
digilog.HTML
digilog.CSS
digilog.SEO
digilog.img