整合營銷服務(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,我們一起飛!


          主站蜘蛛池模板: 色偷偷av一区二区三区| 久久一区二区三区精品| 亚洲国产精品一区二区三区久久 | 韩日午夜在线资源一区二区| 激情内射日本一区二区三区| 少妇精品无码一区二区三区 | 精品女同一区二区三区免费播放| 精品一区二区三区视频| 国产伦精品一区二区三区免.费| 日韩一区二区超清视频| 91麻豆精品国产自产在线观看一区 | 日韩一区二区三区电影在线观看| 精品人妻一区二区三区四区在线| 亚洲视频一区调教| 久久一区二区明星换脸| 日韩精品一区二区午夜成人版 | 久久国产精品最新一区| 日韩精品一区二区三区中文精品| 视频在线一区二区三区| 亚洲综合av一区二区三区不卡| 无码国产精品一区二区免费模式 | 中文无码精品一区二区三区| 亚洲一区二区视频在线观看| 另类ts人妖一区二区三区| 亚洲日韩一区二区三区| 天海翼一区二区三区高清视频| 日韩免费无码一区二区三区| 国产精品视频一区二区三区不卡| 亚洲日韩中文字幕无码一区| 伊人色综合网一区二区三区| 亚洲国产av一区二区三区丶| 精品深夜AV无码一区二区| 寂寞一区在线观看| 国产福利一区二区三区| 精品国产一区二区二三区在线观看 | A国产一区二区免费入口| 亚洲综合国产一区二区三区| 色欲AV蜜臀一区二区三区| 国产精品高清一区二区人妖| 日韩一区二区在线免费观看| 免费一区二区三区在线视频|