counter-increment

Home>CSS>プロパティリファレンス>counter-increment

この情報はお役に立ちましたか?よろしければ皆様にもお知らせください。

  このエントリーをはてなブックマークに追加 mixiチェック  

counter-incrementプロパティの役割

counter-incrementプロパティは、contentプロパティにおいて表示させたい値の増減を指定します。

counter-incrementプロパティに設定できる値

none 変化なし。
変数名 変数の値に1を加える。
変数名 数字 変数の値に指定した数値を加える。数値はマイナスも可。

counter-incrementプロパティの使い方

<style type="text/css">
.count{
counter-increment:count 3;
}
.count:before{
content:"Count: [" counter(count) "] ";
}
</style>
<p class="count">counter-incrementのサンプル</p>
<p class="count">counter-incrementのサンプル2</p>

counter-incrementのサンプル

counter-incrementのサンプル2

上のサンプルでは、countというクラス名が呼び出されるたびに、countという変数に3を加えるように指定しています。

関連リンク

よく読まれている記事

UpDate:2010-7-28