【CSS】counter-increment ：要素の連番(カウンタ)の値を指定する

（例）【CSS】counter-incrementの使用方法

<dl>
<dt class="sample1">炭水化物</dt><dd>ご飯</dd>
<dt class="sample1">たんぱく質</dt><dd>牛肉</dd>
<dt class="sample1">脂質</dt><dd>マヨネーズ</dd>
</dl>

<h3>ランキング</h3>
<dl>
<dt class="sample1">炭水化物</dt><dd>ご飯</dd>
<dt class="sample1">たんぱく質</dt><dd>牛肉</dd>
<dt class="sample1">脂質</dt><dd>マヨネーズ</dd>
</dl>

dt.sample1:before {
counter-increment:sample;
content:counter(sample) "位　";
}
h3 {counter-reset:sample;}

【CSS】counter-increment ：要素の連番(カウンタ)の値を指定する

　CSSのcounter-incrementは、要素の連番（カウンタ）を進めるプロパティです。
　counter-incrementプロパティを使用しカウンタ名を指定した場合、要素が現われる毎にカウンタ値が進みます。負の値を指定してカウンタを戻すことは可能です。