HTML and CSS Reference
In-Depth Information
Then, when the CSS2-conscious browser encounters this in the docu-
ment:
<h1>Kumquat Growers</h1>
it renders it as shown in
Figure 8-19
. To number our chapters using Ro-
man numerals, we would change the properties to:
h1:before { counter-increment : chapter;
counter-reset : section;
content : "Chapter " counter(chapter, upper-roman) ": " }
h2:before { counter-increment : section;
content : "Section " counter(section, lower-roman) ": "}
The
counter( )
value is the value of the counter at the current nesting
level. To access all the values of the same-named counter at all nesting
levels, use the plural
counters( )
value instead. Include the counter
name in the parentheses and a separator string. The browser puts the
separator string between each list of values for the counter in the dis-
play. You may also supply a format type to switch from the default
decimal numbering.
