讲解一下HTML5中新增的特性meter，平时在做网页的时候这个特性还是用处很大的，比如电影评分呀以及饭店评分等可能都会需要用到meter这个属性。

meter元素：用于表示指定范围内的数值，例如，显示硬盘容量或者对某个后选者的投票人数占投票总人数的比例等，都可以使用meter元素。meter元素有多个常用的属性，如下表所示：

最佳值 optimum 和 value 的不同决定了显示的颜色的不同。

绿色：当value和optimum值在一个区间时，它就会呈现出绿色；

黄色：当optimum在high和max之间的时候，value在low和high之间，它就会呈现出黄 色；

红色：当optimum在high和max之间的时候，value值在min和low之间时就会呈现出红 色

（1）当opoptimum=2时如下所示：

<div class="box">
<li><p>大众评分：<meter min="0" low="3" high="6" max="9" optimum="2" value="3"></meter></li>
<li><p>媒体评分：<meter min="0" low="3" high="6" max="9" optimum="2" value="8"></meter></p></li>
<li><p>网站评分：<meter min="0" low="3" high="6" max="9" optimum="2" value="6"></meter></p></li>
</div>

（2）当optimum=4时如下所示：

<div class="box">
<li><p>大众评分：<meter min="0" low="3" high="6" max="9" optimum="4" value="3"></meter></li>
<li><p>媒体评分：<meter min="0" low="3" high="6" max="9" optimum="4" value="6"></meter></p></li>
<li><p>网站评分：<meter min="0" low="3" high="6" max="9" optimum="4" value="8"></meter></p></li>
</div>

 

（3） 当optimum=4时如下所示：

<div class="box">
<li><p>大众评分：<meter min="0" low="3" high="6" max="9" optimum="7" value="2"></meter></li>
<li><p>媒体评分：<meter min="0" low="3" high="6" max="9" optimum="7" value="4"></meter></p></li>
<li><p>网站评分：<meter min="0" low="3" high="6" max="9" optimum="7" value="6"></meter></p></li>
</div>