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