HTML and CSS Reference
In-Depth Information
This is demonstrated in numbered_headings_increment.html, which initializes each
subsection
sequence
at
7
. The
section
counter is incremented in steps of
5
, and the
subsection
counter is reduced in steps of
3
like this:
h2 {
counter-reset: subsection
7
;
}
h2::before {
counter-increment: section
5
;
content: counter(chapter) '.' counter(section) ' ';
}
h3::before {
counter-increment: subsection
-3
;
content: counter(chapter) '.' counter(section) '.' counter(subsection) ' ';
}
As Figure
15-9
shows, the
section
numbers begin at
5
and increase in steps of
5
. The
subsection
numbers
begin at
4
, not
7
, because
counter-increment
deducts
3
from the start number before displaying the counter. The
sequence continues with negative numbers once it falls below zero.
Figure 15-9.
Numbers in a sequence can be increased or decreased by any amount
■
To reset more than one counter in the same style rule, they must be specified together as a
space-separated list like this:
counter-reset: counter1 counter2;
. If you put them in separate declarations,
the last one overrides the previous ones following the normal rules of the cascade.
Caution