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

列印頁面