整合營銷服務(wù)商

          電腦端+手機端+微信端=數(shù)據(jù)同步管理

          免費咨詢熱線:

          html5中meter標(biāo)簽的詳細(xì)介紹

          html5中meter標(biāo)簽的詳細(xì)介紹

          html5版本中新增了很多新標(biāo)簽,今天要介紹的就是其中一個,即meter標(biāo)簽。meter標(biāo)簽由于是html5新增標(biāo)簽,目前IE瀏覽器還不支持,所以用的還不是很多。

          “meter”作為英文單詞有“計量器”的意思,那它作為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)簽元素所屬的一個或多個表單;high:規(guī)定被視作高的值的范圍;low:規(guī)定被視作低的值的范圍;max:規(guī)定范圍的最大值;min:規(guī)定范圍的最小值;optimum:定度量的優(yōu)化值;

          四、實例

          <!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

          運行結(jié)束:

          以上就是關(guān)于meter標(biāo)簽的詳細(xì)介紹,除了各種標(biāo)簽的運用,web前端還有很多知識點需要學(xué)習(xí)。關(guān)注“武漢千鋒”微信公眾號,可獲取更多前端行業(yè)動態(tài)及學(xué)習(xí)資料。

          們經(jīng)常見到如圖中的進(jìn)度條,那么這些進(jìn)度條都是怎么是實現(xiàn)的呢?

          來看看下面這兩個元素。

          1、<meter>:用于表示一個已知最大值和最小值的計數(shù)儀表。比如電池的剩余電量、速度表等。除了可以指定id、style、class、hidden等通用屬性之外,還可以指定下面屬性。

          value:指定計數(shù)儀表的當(dāng)前值,默認(rèn)為0,可以為該屬性指定一個浮點小數(shù)值。

          min:指定計數(shù)儀表的最小值,默認(rèn)為0,可以為該屬性指定一個浮點小數(shù)值。

          max:指定計數(shù)儀表的最大值,默認(rèn)為1,可以為該屬性指定一個浮點小數(shù)值。

          low:指定計數(shù)儀表指定范圍的最小值,該屬性值必須大于等于min屬性指定的值。

          high:指定計數(shù)儀表指定范圍的最大值,該屬性值必須小于等于max屬性指定的值。

          optimum:指定計數(shù)儀表有效范圍的最佳值,如果該值大于high屬性指定的值,則意味著值越大越好;如果該值小于low屬性指定的值,則意味著值越小越好。

          2、<progress>:用于表示一個進(jìn)度條,除了id、style、class、hidden這些通用屬性外,還可以指定以下屬性。

          max:指定進(jìn)度條完成時的值。

          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> 不能作為一個進(jìn)度條來使用, 進(jìn)度條 <progress> 標(biāo)簽。


          HTML 4.01 與 HTML5 之間的差異

          <meter> 是 HTML5 的新標(biāo)簽。


          屬性

          New:HTML5 新屬性。

          屬性描述
          formNewform_id規(guī)定 <meter> 元素所屬的一個或多個表單。
          highNewnumber規(guī)定被界定為高的值的范圍。
          lowNewnumber規(guī)定被界定為低的值的范圍。
          maxNewnumber規(guī)定范圍的最大值。
          minNewnumber規(guī)定范圍的最小值。
          optimumNewnumber規(guī)定度量的最優(yōu)值。
          valueNewnumber必需。規(guī)定度量的當(dāng)前值。

          全局屬性

          <meter> 標(biāo)簽支持全局屬性,查看完整屬性表 HTML全局屬性。


          事件屬性

          <meter> 標(biāo)簽支持所有 HTML事件屬性。

          如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039,我們一起飛!


          主站蜘蛛池模板: 国产成人高清精品一区二区三区| 久久久久久综合一区中文字幕| 国产一区二区三区在线视頻| 国产一区二区三区日韩精品| 国产精品久久亚洲一区二区| 精品人妻少妇一区二区三区| 欧美人妻一区黄a片| 中文字幕av一区| 国产色精品vr一区区三区| 国产成人精品一区二三区| 视频在线一区二区三区| 久久久精品日本一区二区三区| 国产日韩精品一区二区在线观看播放 | 怡红院美国分院一区二区| 国模无码视频一区| 无码人妻精品一区二区| 肥臀熟女一区二区三区| 久久久精品一区二区三区| 人体内射精一区二区三区| 中文字幕精品亚洲无线码一区 | 国产精品综合AV一区二区国产馆| 久久99国产一区二区三区| 日韩精品区一区二区三VR| 亚洲AV无码一区二区三区性色 | 综合无码一区二区三区| 精品欧洲av无码一区二区三区| 视频一区精品自拍| 日韩毛片一区视频免费| 精品伦精品一区二区三区视频 | 区三区激情福利综合中文字幕在线一区 | 精品日产一区二区三区手机| 一区二区三区四区视频| 91成人爽a毛片一区二区| 清纯唯美经典一区二区| 日韩视频一区二区在线观看| 97久久精品一区二区三区| 国产成人无码一区二区在线观看 | 中文字幕日韩人妻不卡一区| 亚洲AV网一区二区三区| 国产情侣一区二区三区| 97一区二区三区四区久久|