meter元素的使用

meter元素用于表示指定范围内的数值。

效果图：

代码如下：

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>meter元素的使用</title>
</head>
<body>
<h1>学生成绩列表</h1>
<p>小红：<meter value="65" min="0" max="100" low="60" hign="80" title="65分" optimum="100">65</meter><br/>小明：<meter value="80" min="0" max="100" low="60" hign="80" title="80分" optimum="100">80</meter><br/>小李：<meter value="75" min="0" max="100" low="60" hign="80" title="75分" optimum="100">75</meter><br/>
</p>
</body>
</html>

重点：

属性	说明
high	定义度量的值位于哪个点被界定为高的值
low	定义度量的值位于哪个点被界定为低的值
max	定义最大值，默认值是1
min	定义最小值，默认值是0
optimum	定义什么样的度量值是最佳的值。如果该值高于high属性，则意味着值越高越好，如果该值低于low属性的值，则意味着值越低越好
value	定义度量的值

声明：“来自于网络，如果侵犯著作权，请联系删除”

meter元素的使用相关推荐

html5 meter样式,使用HTML5“meter”元素
前面我们介绍了HTML5的元素.HTML5的元素和元素经常会被混淆.但他们是不同的元素,在页面中的使用方式也是不同的. 元素用于表示一个标量测量值或一个百分比值.和元素不一样,元素的最小值和最大值在私 ...
h5---新增的结构性元素(header、footer、nav、article、section、aside、time、progress和meter元素进度条）
前端入门笔记之零散学习(1) 最开始我们页面布局用的是table标签,然后演变成div+css布局,直到现在我们进行布局用新增的结构性元素. div+css布局新增的结构性元素常见的新增结构性元素 ...
新增的output元素 progress元素 meter元素 keygen元素
结果图 <output>是双标签 name:定义对象的唯一属性 for:定义输出域相关的一个或多个元素. form:定义所属的一个至多个表单. progress和meter一般和JS一起使 ...
新元素之video,audio,meter,datalist,keygen,output
video 通过<video>标签,我们可以抛弃最近不怎么讨好的Flash,直接在页面中播放视频文件.视频文件自然是最符合语义化的文件格式,但该元素标签同样支持音频与图片. 过去(及目前) ...
html range关联文本框,HTML5gt;meter标签与input(type=range)标签结合制作简易范围指示器...
HTML5>meter标签与input(type=range)标签结合制作简易范围指示器发布时间:2020-03-26 15:41 很多时候我们能看到这样的表示范围的优化工具,能给人带来很好的 ...
progress与meter的区别
<progress>元素和<meter>元素经常会被混淆.它们之间的区别主要有以下两点: <progress>元素用于显示某个特定任务的时间进度.这个任务的时间上限 ...
伪元素控制网页表单样式
当开发web应用程序时,表单样式是个头疼的问题.以前,web开发人员不得不接受一个现实,就是由客户端浏览器控制表单样式.然而,作者通过伪元素给web渲染引擎添加钩子,就可以控制表单的显示. 然而,所有 ...
（一）html5中的新增元素和废除元素
//刘梦冰发表于2015-6-29 1.新增的结构元素 (1)section元素 section元素表示页面中的一个内容区块,比如章节.页眉.页脚或者页面中的其他部分,它可以与h1.h2.h3等元素结 ...
HTML 5新增的元素
HTML 5结构元素这真是大快人心.目前,我们定义结构只能通过一个"万能"的div, 试图通过设置它的特性id的值如header, footer, sidebar等来分别表达头部 ...

meter元素的使用

meter元素用于表示指定范围内的数值。

效果图：

代码如下：

重点：

meter元素的使用相关推荐

最新文章

热门文章