整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
html5版本中新增了很多新標簽，今天要介紹的就是其中一個，即meter標簽。meter標簽由于是html5新增標簽，目前IE瀏覽器還不支持，所以用的還不是很多。
“meter”作為英文單詞有“計量器”的意思，那它作為html中的標簽又是用來做什么的呢？接下來我們一起來看看html中meter標簽的定義及用法吧！
一、meter標簽定義及用法
在html中，meter標簽是html5版本中新增標簽，是使用來定義已知范圍或分數值內的標量測量（比如：磁盤用量、相關性等等）。
meter標簽的效果很像進度條，但是它不作為進度條來使用。如果要表示進度條，通常使用progress標簽。
二、meter標簽語法格式
<meter value="值"></meter>
說明：
meter標簽是雙標簽，但是標簽中的內容不在瀏覽器中顯示；meter標簽的value屬性規定度量的當前值，是必需屬性，其余的屬性是可選屬性；
三、meter標簽屬性
value：規定度量的當前值，必需參數；form：規定meter標簽元素所屬的一個或多個表單；high：規定被視作高的值的范圍；low：規定被視作低的值的范圍；max：規定范圍的最大值；min：規定范圍的最小值；optimum：定度量的優化值；
四、實例
<!DOCTYPE html><html><head>
<meta charset="utf-8" />
<title>html中meter標簽的詳細介紹</title>
</head>
<body style="background-color: bisque;">
<h3>meter標簽演示</h3>
十分之七：<meter value="7" min="0" max="10">十分之七</meter><br>
80%：<meter value="0.8">80%</meter>
<h4>IE瀏覽器目前不支持 meter標簽</h4>
</body></html
運行結束：
以上就是關于meter標簽的詳細介紹，除了各種標簽的運用，web前端還有很多知識點需要學習。關注“武漢千鋒”微信公眾號，可獲取更多前端行業動態及學習資料。
們經常見到如圖中的進度條，那么這些進度條都是怎么是實現的呢？
來看看下面這兩個元素。
1、<meter>:用于表示一個已知最大值和最小值的計數儀表。比如電池的剩余電量、速度表等。除了可以指定id、style、class、hidden等通用屬性之外，還可以指定下面屬性。
value：指定計數儀表的當前值，默認為0，可以為該屬性指定一個浮點小數值。
min：指定計數儀表的最小值，默認為0，可以為該屬性指定一個浮點小數值。
max：指定計數儀表的最大值，默認為1，可以為該屬性指定一個浮點小數值。
low：指定計數儀表指定范圍的最小值，該屬性值必須大于等于min屬性指定的值。
high：指定計數儀表指定范圍的最大值，該屬性值必須小于等于max屬性指定的值。
optimum：指定計數儀表有效范圍的最佳值，如果該值大于high屬性指定的值，則意味著值越大越好；如果該值小于low屬性指定的值，則意味著值越小越好。
2、<progress>：用于表示一個進度條，除了id、style、class、hidden這些通用屬性外，還可以指定以下屬性。
max：指定進度條完成時的值。
value：指定進度條當前完成的進度值。
例
使用 meter 元素展示給定的數據范圍：
<meter value="2" min="0" max="10">2 out of 10</meter><br>
<meter value="0.6">60%</meter>
瀏覽器支持
Firefox、Opera、Chrome 和 Safari 6 支持 <meter> 標簽。
標簽定義及使用說明
<meter> 標簽定義度量衡。僅用于已知最大和最小值的度量。
比如：磁盤使用情況，查詢結果的相關性等。
注意： <meter> 不能作為一個進度條來使用， 進度條 <progress> 標簽。
HTML 4.01 與 HTML5 之間的差異
<meter> 是 HTML5 的新標簽。
屬性
New：HTML5 新屬性。
| 屬性 | 值 | 描述 |
|---|---|---|
| formNew | form_id | 規定 <meter> 元素所屬的一個或多個表單。 |
| highNew | number | 規定被界定為高的值的范圍。 |
| lowNew | number | 規定被界定為低的值的范圍。 |
| maxNew | number | 規定范圍的最大值。 |
| minNew | number | 規定范圍的最小值。 |
| optimumNew | number | 規定度量的最優值。 |
| valueNew | number | 必需。規定度量的當前值。 |
全局屬性
<meter> 標簽支持全局屬性，查看完整屬性表 HTML全局屬性。
事件屬性
<meter> 標簽支持所有 HTML事件屬性。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
