mozilla

Revision 20553 of counter-increment

  • Revision slug: CSS/counter-increment
  • Revision title: counter-increment
  • Revision id: 20553
  • Created:
  • Creator: Spanglerco
  • Is current revision? No
  • Comment Wrong CSS Comments

Revision Content

{{template.CSSMozExtensionRef()}}

Summary

counter-increment is used to increase the value of CSS Counters by a given value.

  • Applies to: all elements
  • Inherited: no

Syntax

counter-increment: [<identifier> <integer>?]+ | inherit | none

Values

identifier
The name of the counter to increment.
integer
The value to add to the counter. Defaults to 1 if not given.

You may specify as many counters to increment as you want, each separated by a space.

Related properties

Examples

h1 {
  counter-increment: chapter section 2 page;
  /* Increases the value of the chapter and page counters by 1
     and the section counter by 2. */
}

See also

Revision Source

<p> 
{{template.CSSMozExtensionRef()}}
</p>
<h3 name="Summary"> Summary </h3>
<p><code>counter-increment</code> is used to increase the value of <a href="en/CSS_Counters">CSS Counters</a> by a given value.
</p>
<ul><li> Applies to: all elements
</li><li> Inherited: no
</li></ul>
<h3 name="Syntax"> Syntax </h3>
<pre class="eval">counter-increment: [&lt;identifier&gt; &lt;integer&gt;?]+ | inherit | none
</pre>
<h3 name="Values"> Values </h3>
<dl><dt>identifier</dt><dd> The name of the counter to increment.
</dd><dt>integer</dt><dd> The value to add to the counter. Defaults to 1 if not given.
</dd></dl>
<p>You may specify as many counters to increment as you want, each separated by a space.
</p>
<h3 name="Related_properties"> Related properties </h3>
<ul><li> <a href="en/CSS/counter-reset">counter-reset</a> resets specified <a href="en/CSS_Counters">CSS Counters</a> to a given amount.
</li></ul>
<h3 name="Examples"> Examples </h3>
<pre>h1 {
  counter-increment: chapter section 2 page;
  /* Increases the value of the chapter and page counters by 1
     and the section counter by 2. */
}
</pre>
<h3 name="See_also"> See also </h3>
<ul><li> <a href="en/CSS_Counters">CSS Counters</a>
</li></ul>
Revert to this revision