Как отображать только КРАСНЫЙ и Зеленый цвет зависит от низкого заданного значения с помощью элемента HTML Meter - PullRequest
Новая
       30

Как отображать только КРАСНЫЙ и Зеленый цвет зависит от низкого заданного значения с помощью элемента HTML Meter

2 голосов
/ 19 марта 2020

Команда,

Я использую элемент измерения в HTML и хочет отображать только (красный и зеленый). Цвет зависит от изменения значения. Если значение <20, цвет индикатора станет КРАСНЫМ, а если значение> 20, цвет индикатора станет зеленым. У меня есть много способов поиска, но безуспешно. Любая идея высоко ценится. 

<meter min="0" low="20" max="100" value="65"></meter>

1 Ответ

1 голос
/ 19 марта 2020

Проверьте с 

meter::-webkit-meter-optimum-value {
  background: green;
}

meter::-webkit-meter-suboptimum-value {
  background: green;
}

meter::-webkit-meter-even-less-good-value  {
  background: red;
}

meter:-moz-meter-optimum::-moz-meter-bar {
  background: green;
}

meter:-moz-meter-sub-optimum::-moz-meter-bar {
  background: green;
}

meter:-moz-meter-sub-sub-optimum::-moz-meter-bar {
  background: red;
}
<meter min="0" max="100" low="20" high="75" optimum="100" value="19"></meter>
<meter min="0" max="100" low="20" high="75" optimum="100" value="25"></meter>
...