HTML таг meter
Пример
Кратък пример как се използва тагът <meter>.
<label for="disk-usage">Използвано дисково пространство:</label>
<meter id="disk-usage" value="70" min="0" max="100" low="40" high="80" optimum="30">
70% използвано
</meter>Дефиниция и употреба
Виж как се ползва тагът <meter>.
<meter> представлява скаларна измерима стойност в известен диапазон – например резултат, ниво на батерия, използвано дисково пространство, сила на парола и др. Той не е предназначен за показване на прогрес на задача (за това се използва <progress>), а за показване на текуща стойност спрямо минимална и максимална граница.
Основните атрибути са:
value– текущата стойност (задължителен атрибут).minиmax– минимална и максимална стойност на диапазона (по подразбиране0и1).low,high,optimum– определят прагове за ниски/високи стойности и оптимален диапазон, които някои браузъри визуално отличават (например в различни цветове).
Елементът е редов (inline-block) и може да съдържа текст, който се показва, ако браузърът не поддържа <meter>. За по-добра достъпност се препоръчва използване на <label> с атрибут for, както и добавяне на текстово описание на стойността (например чрез aria-label или видим текст до елемента).
Browser Support
| Browser | Поддръжка |
|---|---|
 Chrome |
✔️ |
 Firefox |
✔️ |
 Edge |
✔️ |
 Safari |
✔️ |
 Opera |
✔️ |
Атрибути
| Атрибут | Описание |
|---|---|
value |
Задава текущата стойност на измерването. Задължителен атрибут. |
min |
Минимална възможна стойност. По подразбиране е 0. |
max |
Максимална възможна стойност. По подразбиране е 1. |
low |
Долна граница, под която стойността се счита за ниска. |
high |
Горна граница, над която стойността се счита за висока. |
optimum |
Оптимална стойност или диапазон, спрямо който браузърът може да оцвети индикатора. |
form |
Свързва елемента с конкретна форма по id, дори да не е вътре в нея. |