CSS range Descriptor

The CSS range descriptor is used with the @counter-style at-rule to define the ranges over which the counter style is defined.

The @counter-style rule accepts a name, followed by a number of descriptors, which define the counter style. The range descriptor can be used to specify that a marker style is used only on those list items that fall within a certain range.

Here's an example of using the range descriptor.

If your browser supports the @counter-style at-rule, the above code could result in a list that looks something like this:

An ordered list styled with symbols appearing only at certain ranges.

Possible Values

The range descriptor accepts the following values.

auto

When this value is used, the range depends on the counter system:

For cyclic, numeric, and fixed systems, the range is negative infinity to positive infinity.

For alphabetic and symbolic systems, the range is 1 to positive infinity.

For additive systems, the range is 0 to positive infinity.

For extends systems, the range is whatever auto would produce for the extended system; if extending a complex predefined style, the range is the styleâ€™s defined range.

This defines a comma-separated list of ranges. For each individual range, the first value is the lower bound and the second value is the upper bound. The range is inclusive, so it contains both the lower and upper bound numbers.