混淆在<meter>标签

Question

有人可以帮助我了解2米 为什么之间的差异的颜色区别它们之间虽然他们有相同值 ？

<meter low="69" high="80" max="100" value="84">A</meter><span>MDN example</span> <br> 
 

 
<meter low="30" high="80" max="100" value="84">B</meter>

Answer 1

这是因为不同的低值和高值的。

现在米标签形成三个区域：

一个从最小（0）到低时，另一个从低到高和第三从高到最大（100）。

最佳值的默认值为50.您可以将其设置为您想要的值。现在在哪个地区最适合的地方是绿色的。邻居区域显示为黄色，最远的显示为红色。

在第一示例中，默认最佳值是50。如果我使low=60和high=80，然后在0到60的任何将是绿色的，60〜80将是黄色的和为80〜100将为红色。

在第二个例子中，我设定了optimum=70，保持低位和高位相同。然后0到60之间的任何东西都会变成黄色，60到80之间变成绿色，80到100变成黄色。

<p>First exmple</p> 
 
<meter low="60" high="80" max="100" value="34">A</meter><br/> 
 
<meter low="60" high="80" max="100" value="65">B</meter><br/> 
 
<meter low="60" high="80" max="100" value="84">C</meter><br/> 
 
<p>Second exmple</p> 
 
<meter low="60" high="80" optimum="70" max="100" value="34">A</meter><br/> 
 
<meter low="60" high="80" optimum="70" max="100" value="65">B</meter><br/> 
 
<meter low="60" high="80" optimum="70" max="100" value="84">C</meter><br/>

Answer 2

色差是由于米标签比较值到最佳值的方式。下面将做两米黄色：

<span>MDN example</span><br> 
 
<meter low="69" optimum="80" high="80" max="100" value="84">A</meter><br> 
 
<meter low="30" optimum="40" high="80" max="100" value="84">B</meter>

详细解释这个可以发现here