HTML5標記 <meter> 屬性

Question

HTML5規范中有一個名為<meter>的新標記。 它有三個屬性是如此清晰易懂，但它們的功能和視覺效果並不那么清晰。 它們高 ， 低 ， 最佳 。

我看到一些紅色或黃色的米元素，我想這些顏色與這些屬性有關。 但我不知道怎么做。

有人能為我描述一下嗎？

Answer 1

規范並沒有真正指定顏色。 對於默認樣式，在Firefox 22和Safari 6中，

• 如果low < optimum < high ：

  • 如果值< low或> high ，則顯示為黃色，
  • 否則為綠色（最佳無效）。

• 如果low < high < optimum ：

  • 如果該值< low ，則顯示為紅色。
  • 如果值< high ，則顯示為黃色。
  • 否則綠色。

• 如果optimum < low < high ：

  • 如果值> high ，則顯示為紅色。
  • 如果值> low ，則顯示為黃色。
  • 否則綠色。

這實際上是規范所說的 ：

UA對量規區域的要求 ：如果最佳點等於低邊界或高邊界，或者它們之間的任何位置，那么量表的低邊界和高邊界之間的區域必須被視為最佳區域，並且如果有的話，低和高部分必須被視為次優。 否則，如果最佳點小於低邊界，則必須將最小值和低邊界之間的區域視為最佳區域，從低邊界到高邊界的區域必須被視為次優區域，其余地區必須被視為一個更不好的地區。 最后，如果最佳點高於高邊界，那么情況就會逆轉; 必須將高邊界和最大值之間的區域視為最佳區域，從高邊界到低邊界的區域必須被視為次優區域，其余區域必須被視為更不好的區域。

我們使用綠色表示最佳區域，黃色表示次優區域，紅色表示更好的區域。

順便說一句，您可以設置<meter>元素的樣式 （請參閱如何設置HTML5 <米>標簽的樣式 ）。

Answer 2

了解這3個段（低，最佳，高）的功能和視覺效果取決於儀表元素上指定的屬性及其值; 相同的值可以以不同的顏色（綠色/黃色/紅色）顯示，具體取決於其段的類型

為了清楚地了解儀表顏色，值，段觀看此視頻