HTML - 最佳属性

HTML optimum 属性用于指定仪表值被认为是最佳值的范围。

此属性必须在范围内（由min 属性和max 属性定义）。例如，如果您正在创建用于显示 CPU 温度的仪表，则可以将 min 设置为 30，max 设置为 100，optimum 设置为 60。这直观地显示了大约 60 摄氏度的温度被认为是理想的。

浏览器将根据值是否小于或等于最佳值来更改仪表条的颜色。

语法

<meter optimum="value"></meter>

其中 value 是一个浮点数，表示仪表的最佳值。

应用于

以下列出的元素允许使用 HTML optimum 属性

元素	描述
<meter>	HTML <low> 标签用于在给定范围内渲染数据。

HTML optimum 属性示例

以下示例将说明 HTML optimum 属性，以及我们应该在哪里以及如何使用此属性！

跨高低值的最佳值

在以下示例中，我们将注意到对于各种最佳值，仪表条的颜色变化。

<!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>

根据最佳值操作仪表元素的值。

考虑另一种情况，我们将与 optimum 属性一起运行脚本。在这里，用户可以动态降低值以达到目标。

<!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>

支持的浏览器

属性
optimum	是 8.0	否	是 6.0	是 6.0	是 11.0

html_attributes_reference.htm

打印页面