Meter
The native <meter>, coloured by band: good, fair or poor against low, high and optimum.
Examples
Bands
Lower is better
optimum below low flips the bands: a high value is now the poor one.Anatomy
meter | The native element, no class. Full width; the fill is success, warning or danger by band. |
API
| Attribute | Values | Description |
|---|---|---|
value | <n> | The measurement. |
min | <n> | Lower end of the scale. Default 0. |
max | <n> | Upper end of the scale. Default 1. |
low | <n> | Top of the low band. |
high | <n> | Bottom of the high band. |
optimum | <n> | Where good is. The band it falls in draws in success, the next in warning, the far one in danger. |
Accessibility
<meter>has the meter role and announces its value. Label it with<label for>oraria-label.- The band is colour only; put the number or a word in the label ("82% used").
- Use
<progress>for work being done; a meter is a measurement within a known range.