1. 爱易网页
  2. HTML教程
  3. HTML基础教程:meter标签详细解说

HTML基础教程:meter标签详细解说

日期：2013-12-22　 浏览次数：20768 次

网页制造aiyiweb文章简介：标签与progress百分比标签差不多，它次要表现规定范围内的数量值，例如磁盘的食用量，对某个候选者人数占总投票人数的比例值等.

meter标签：
此标签与progress百分比标签差不多，它次要表现规定范围内的数量值，例如磁盘的食用量，对某个候选者人数占总投票人数的比例值等，如下图：
meter有六个属性：
属性名称 描述
value 在元素中表现出来的实际数量值。该属性缺省值为0，可以给该属性指定浮点数小数值。
min 指定规定范围时允许使用的最小值，该属性缺省值为0，设置最小值时，值不可小雨0。
max 指定规定范围时允许使用的最大值，如果设定该属性值小于min属性的值，那么浏览器会把min设置为最大值。max属性缺省值为1。
low 规定范围的下限值，必须小于或等于high属性的值。同样的，如果low属性值小于min属性值，那么浏览器把min属性的值视为low属性的值。
high 规定范围的上限值，如果该属性值小于low属性值，那么把low属性值视为high属性值，同样的，如果该属性值大于max属性值，那么把max属性值视为high属性的值。
optimum 设置最佳值，属性值必须在min属性值与max属性值之间，可以大于high属性值。



案例：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>HTML5每日一练meter标签的使用</title>
</head>

<body>
<h1>W3Cfuns-HTML5每日一练meter标签的使用</h1>
<p>空间剩余大小：<meter min="0" max="1024" value="600">600/1024</meter>600/1024 GB</p>
<p>您的得分是：<meter min="0" max="100" low="60" high="90" optimum="100" value="91">91分</meter>91分</p>
</body>
</html>

相关资料更多>

  1. 生手，求帮助
  2. 获取iframe中的document元素（无论html还是xml都适用）
  3. css图片定位，诠释（定义摘录）
  4. 两个div怎的横向排列
  5. jsp, servlet 与 jhtml差异
  6. IE，火狐狸，OPERA等浏览器CSS Hack和向后兼容
  7. 画布旋转——HTML5之奇效
  8. HTML标签图片alt在优化中的慎重运用
  9. Css学习札记(1)