HTML optimum 属性用于指定仪表值被视为最优值的范围。
此属性必须在该范围内（由 min 属性和 max 属性定义）。例如，如果要创建一个仪表来显示 CPU 温度，则可以将最小值设置为 30，将最大值设置为 100，将最佳值设置为 60。这在视觉上表明，60 摄氏度左右的温度被认为是理想的
浏览器将根据值是否小于或等于最佳值来更改仪表条的颜色。
语法
<meter optimum="value"></meter>
其中 value 是一个浮点数，表示仪表的最优值。
适用于
下面列出的元素允许使用 HTML optimum 属性
| 元素 | 描述 |
|---|---|
| <meter> | HTML <low>标签用于在给定范围内呈现数据。 |
HTML optimum 属性的示例
以下示例将说明 HTML optimum 属性，我们应该在何处以及如何使用此属性！
在high 和 low 之间实现最佳值
在以下示例中，我们将注意到各种最佳值的仪表条的颜色变化。
<!DOCTYPE html>
<html>
<body>
<h2> HTML optimum attribute </h2>
<p>optimum value below low and high:
<meter value="0.6"
max="0.9"
min="0.1"
optimum="0.1"
high="0.5"
low="0.2">
</meter>
</p>
<p>optimum value between low and high:
<meter value="0.6"
max="0.9"
min="0.1"
optimum="0.3"
high="0.5"
low="0.2">
</meter>
</p>
<p>optimum value above low and high:
<meter value="0.6"
max="0.9"
min="0.1"
optimum="0.7"
high="0.5"
low="0.2">
</meter>
</p>
</body>
</html>
根据最优值操纵仪表元素的值。
考虑到另一种情况，我们将在其中运行脚本以及最佳属性。在这里，用户可以动态减少值以达到目标。
<!DOCTYPE html>
<html lang="en">
<body>
<p>Example of the 'low' attribute</p>
<fieldset>
<legend>Meter-high</legend>
<label for="">Rahul's Work Load</label>
<meter high="70"
low="30"
min="0"
max="100"
value="75"
id='rahul'>
</meter>
<br><br>
<span id='res'>
Above Average Workload
</span>
<br><br>
<button onclick="decrease()">
Reduce Tasks
</button>
</fieldset>
<script>
function decrease() {
var h = document.getElementById('rahul');
var work = h.value;
h.value = h.value - 10;
var res = document.getElementById('res');
res.innerHTML =
"Rahul's workload has decreased from "
+ work + " to " + h.value;
}
</script>
</body>
</html>
支持的浏览器
| 浏览器 |  |
 |
 |
 |
 |
|---|---|---|---|---|---|
| 是否支持 | 8.0 | No | 6.0 | 6.0 | 11.0 |
