The fallback
descriptor can be used to specify a counter style to fall back to if the current counter style cannot create a marker representation for a particular counter value.
The fallback
descriptor can be used to specify a counter style to fall back to if the current counter style cannot create a marker representation for a particular counter value.
/* Keyword values */ fallback: lower-alpha; fallback: custom-gangnam-style;
If the specified fallback style is also unable to construct a representation, then its fallback style will be used. If a valid fallback style is not specified, it defaults to decimal
.
A couple of scenarios where a fallback style will be used are:
Related at-rule | @counter-style |
---|---|
Initial value | decimal |
Computed value | as specified |
fallback =
<counter-style-name>
<ul class="list"> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> <li>Five</li> </ul>
@counter-style fallback-example { system: fixed; symbols: "\24B6""\24B7""\24B8"; fallback: upper-alpha; } .list { list-style: fallback-example; }
Specification |
---|
CSS Counter Styles Level 3 # counter-style-fallback |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
fallback |
91 | 91 | 33 | No | 77 | No | 91 | 91 | 33 | 64 | No | 16.0 |
list-style
, list-style-image
, list-style-position
symbols()
: the functional notation creating anonymous counter styles
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style/fallback