[css3-page] Clarify 'counter-increment' vs. the 'page' counter.
authorSimon Sapin <simon.sapin@exyr.org>
Mon, 11 Feb 2013 18:46:59 -0800
changeset 74412a7cb1ed8232
parent 7440 b2d87226b3e3
child 7442 06a73291478f
[css3-page] Clarify 'counter-increment' vs. the 'page' counter.
css3-page/Overview.html
css3-page/Overview.src.html
     1.1 --- a/css3-page/Overview.html	Mon Feb 11 17:45:58 2013 -0800
     1.2 +++ b/css3-page/Overview.html	Mon Feb 11 18:46:59 2013 -0800
     1.3 @@ -2062,25 +2062,6 @@
     1.4       content in page-margin boxes. This is useful for maintaining a page
     1.5       count.
     1.6  
     1.7 -    <div class=example>
     1.8 -     <p>The following rules result in the placement of the current page
     1.9 -      number in the middle of the outside margin of each page.
    1.10 -
    1.11 -     <pre>
    1.12 -@page {
    1.13 -margin: 10%;
    1.14 -counter-increment: page;
    1.15 -
    1.16 -@top-center {
    1.17 -  font-family: sans-serif;
    1.18 -  font-weight: bold;
    1.19 -  font-size: 2em;
    1.20 -  content: counter(page);
    1.21 -}
    1.22 -}
    1.23 -</pre>
    1.24 -    </div>
    1.25 -
    1.26      <p>A ‘<code class=property>counter-increment</code>’ within either a
    1.27       page or margin context causes the counter to increment with the
    1.28       generation of each page box.
    1.29 @@ -2101,19 +2082,46 @@
    1.30       break. Use of the counter in this way does not affect the calculation of
    1.31       the counter's value.
    1.32  
    1.33 -    <p>A counter named ‘<a href="#page"><code class=css>page</code></a>’
    1.34 -     is automatically created and incremented on every page of the document.
    1.35 -     Specifically, the UA must automatically create and increment such a
    1.36 -     counter as if ‘<code class=css>@page { counter-increment: page;
    1.37 -     }</code>’ were specified. The implied ‘<a href="#page"><code
    1.38 -     class=css>page</code></a>’ counter is a real counter, and can be
    1.39 -     directly affected using the ‘<code
    1.40 +    <p> A counter named ‘<a href="#page"><code class=css>page</code></a>’
    1.41 +     is automatically created and incremented by 1 on every page of the
    1.42 +     document, unless the ‘<code class=property>counter-increment</code>’
    1.43 +     property in the <a href="#page-context"><i>page context</i></a>
    1.44 +     explicitly specifies a different increment for the ‘<a
    1.45 +     href="#page"><code class=css>page</code></a>’ counter. The implied
    1.46 +     ‘<a href="#page"><code class=css>page</code></a>’ counter is a real
    1.47 +     counter, and can be directly affected using the ‘<code
    1.48       class=property>counter-increment</code>’ and ‘<code
    1.49       class=property>counter-reset</code>’ properties when named explicitly
    1.50       in those properties. It can also be used in the ‘<code
    1.51       class=css>counter()</code>’ and ‘<code
    1.52       class=css>counters()</code>’ function forms.
    1.53  
    1.54 +    <div class=example>
    1.55 +     <p>The following rules result in the placement of the current page
    1.56 +      number in the middle of the outside margin of each page.
    1.57 +
    1.58 +     <pre>
    1.59 +@page {
    1.60 +  margin: 10%;
    1.61 +
    1.62 +  @top-center {
    1.63 +    font-family: sans-serif;
    1.64 +    font-weight: bold;
    1.65 +    font-size: 2em;
    1.66 +    content: counter(page);
    1.67 +  }
    1.68 +}
    1.69 +</pre>
    1.70 +
    1.71 +     <p>Adding the following rule will make all pages even-numbered.
    1.72 +
    1.73 +     <pre>
    1.74 +@page {
    1.75 +  counter-increment: page 2;
    1.76 +}
    1.77 +</pre>
    1.78 +    </div>
    1.79 +
    1.80      <p>Additionally, a counter named ‘<a href="#page"><code
    1.81       class=css>pages</code></a>’ is automatically created by the UA. Its
    1.82       value is always the total number of pages in the document. (In
     2.1 --- a/css3-page/Overview.src.html	Mon Feb 11 17:45:58 2013 -0800
     2.2 +++ b/css3-page/Overview.src.html	Mon Feb 11 18:46:59 2013 -0800
     2.3 @@ -1565,25 +1565,6 @@
     2.4  rule, and used as content in page-margin boxes.
     2.5  This is useful for maintaining a page count.</p>
     2.6  
     2.7 -<div class="example">
     2.8 -
     2.9 -<p>The following rules result in the placement of the current page number in the
    2.10 -middle of the outside margin of each page.</p>
    2.11 -<pre>
    2.12 -@page {
    2.13 -margin: 10%;
    2.14 -counter-increment: page;
    2.15 -
    2.16 -@top-center {
    2.17 -  font-family: sans-serif;
    2.18 -  font-weight: bold;
    2.19 -  font-size: 2em;
    2.20 -  content: counter(page);
    2.21 -}
    2.22 -}
    2.23 -</pre>
    2.24 -</div>
    2.25 -
    2.26  <p>A 'counter-increment' within either a page or margin context causes the counter
    2.27  to increment with the generation of each page box.</p>
    2.28  
    2.29 @@ -1603,13 +1584,40 @@
    2.30  flow that spans the page break. Use of the counter in this way does not affect
    2.31  the calculation of the counter's value.</p>
    2.32  
    2.33 -<p>A counter named ''page'' is automatically created and incremented on every
    2.34 -page of the document. Specifically, the UA must automatically create and
    2.35 -increment such a counter as if ''@page { counter-increment: page; }'' were
    2.36 -specified. The implied ''page'' counter is a real counter, and can be directly
    2.37 -affected using the 'counter-increment' and 'counter-reset' properties when
    2.38 -named explicitly in those properties. It can also be used in the 'counter()'
    2.39 -and 'counters()' function forms.</p>
    2.40 +<p>
    2.41 +  A counter named ''page'' is automatically created
    2.42 +  and incremented by 1 on every page of the document,
    2.43 +  unless the 'counter-increment' property in the <i>page context</i>
    2.44 +  explicitly specifies a different increment for the ''page'' counter.
    2.45 +  The implied ''page'' counter is a real counter,
    2.46 +  and can be directly affected using the 'counter-increment' and 'counter-reset' properties
    2.47 +  when named explicitly in those properties.
    2.48 +  It can also be used in the 'counter()' and 'counters()' function forms.
    2.49 +</p>
    2.50 +
    2.51 +<div class="example">
    2.52 +<p>The following rules result in the placement of the current page number in the
    2.53 +middle of the outside margin of each page.</p>
    2.54 +<pre>
    2.55 +@page {
    2.56 +  margin: 10%;
    2.57 +
    2.58 +  @top-center {
    2.59 +    font-family: sans-serif;
    2.60 +    font-weight: bold;
    2.61 +    font-size: 2em;
    2.62 +    content: counter(page);
    2.63 +  }
    2.64 +}
    2.65 +</pre>
    2.66 +
    2.67 +<p>Adding the following rule will make all pages even-numbered.</p>
    2.68 +<pre>
    2.69 +@page {
    2.70 +  counter-increment: page 2;
    2.71 +}
    2.72 +</pre>
    2.73 +</div>
    2.74  
    2.75  <p>Additionally, a counter named ''pages'' is automatically created by the UA.
    2.76  Its value is always the total number of pages in the document. (In continuous