百科狗-知识改变命运!

- 进度条 - html5 表单

是丫丫呀2年前 (2023-11-21)阅读数 32#技术干货
文章标签标签

版本:HTML5

HTML中的元素用来显示一项任务的完成进度。虽然规范中没有规定该元素具体如何显示,浏览器开发商可以自己决定,但通常情况下,该元素都显示为一个进度条形式.

浏览器支持

IE 10、Firefox、Opera、Chrome 和 Safari 6 支持标签。
注释:IE 9 或者更早版本的 IE 浏览器不支持标签。

示例

对象的下载进程:

85%
85%

标签定义及使用说明

  • 标签定义运行中的任务进度(进程)。可以使用标签来显示 JavaScript 中耗费时间的函数的进程。
  • 标签不适合用来表示度量衡(例如,磁盘空间使用情况或相关的查询结果)。表示度量衡,请使用标签。

使用上下文

允许内容段落内容元素
是否可以省略标签不可以,起始标签和结束标签都是必须的.
有效的父元素段落内容元素,但不能包含其他的后代元素.
规范文档HTML5, section 4.10.16

属性

属性描述
maxHTML5新增number规定需要完成的值。
valueHTML5新增number规定进程的当前值。

和其他的HTML元素一样,该元素具有全局属性.

  • max该属性描述了这个元素所表示的任务一共需要完成多少工作.
  • value该属性用来指定该进度条已完成的工作量。如果没有value属性,则该进度条的进度为"不确定",也就是说,进度条不会显示任何进度,你无法估计当前的工作会在何时完成(比如在下载一个未知大小的文件时,下载对话框中的进度条就是这样的).

你可以使用orient属性来指定该进度条的显示方向是横向(默认)还是纵向.CSS伪类:indeterminate可以用来匹配那些不确定的进度条.

HTML 4.01 与 HTML 5 之间的差异

标签是 HTML 5 中的新标签。

全局属性

标签支持HTML 的全局属性。

 - 进度条 - html5 表单

class, contenteditable, contextmenu, dir, draggable, id, irrelevant,lang, ref, registrationmark, tabindex, template, title

事件属性

标签支持HTML 的事件属性。

onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup, onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout, onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload

例子

70 %
70 %

内容声明:本文中引用的各种信息及资料(包括但不限于文字、数据、图表及超链接等)均来源于该信息及资料的相关主体(包括但不限于公司、媒体、协会等机构)的官方网站或公开发表的信息。部分内容参考包括:(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供参考使用,不准确地方联系删除处理!本站为非盈利性质站点,本着为中国教育事业出一份力,发布内容不收取任何费用也不接任何广告!)
{if $zbp->Config('yd1125')->foot}