HTML参考手册
标签 | Elements
progress
在HTML5中引入
HTML中的progress (<progress>
) 元素用来显示一项任务的完成进度.虽然规范中没有规定该元素具体如何显示,浏览器开发商可以自己决定,但通常情况下,该元素都显示为一个进度条形式.
内容类别 |
Flow content, phrasing content, labelable content, palpable content. |
---|---|
允许的内容 |
Phrasing content ,但其后代中不得有<progress>元素。 |
标记遗漏 |
没有,起始和结束标签都是强制性的。 |
允许父母 |
任何接受 phrasing content 的元素。 |
允许ARIA角色 |
没有 |
DOM界面 |
HTMLProgressElement |
属性
这个元素包含全局属性。
max
该属性描述progress
元素指示的任务需要多少工作。该max
属性(如果存在)必须具有大于零的值并且是有效的浮点数。默认值是1.
value
此属性指定已完成多少任务。它必须是0 max
到0 之间的有效浮点数,如果max
省略,则在0和1之间。如果没有value
属性,进度条是不确定的; 这表明活动正在进行,没有迹象表明预计会花多长时间。
注:最小值始终为0,并且min
属性不允许用于progress元素。您可以使用-moz-orient
CSS属性来指定进度条应该水平呈现(默认)还是垂直呈现。
注:该:indeterminate
伪类可用于匹配不确定进度条。在给它一个值之后,要将进度条更改为不确定的,你必须使用删除值属性element.removeAttribute("value")
例子
<progress value="70" max="100">70 %</progress>
结果
在Windows 7上,生成的进度如下所示:
其他例子
See -moz-orient
.
规范
Specification |
Status |
Comment |
---|---|---|
HTML Living StandardThe definition of '<progress>' in that specification. |
Living Standard |
|
HTML5The definition of '<progress>' in that specification. |
Recommendation |
Initial definition |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
---|---|---|---|---|---|---|
Basic Support |
6 |
(Yes) |
61 2 |
10 |
11 |
5.2 |
max |
6 |
(Yes) |
6 |
10 |
11 |
5.2 |
value |
6 |
(Yes) |
6 |
10 |
11 |
5.2 |
Feature |
Android |
Chrome for Android |
Edge mobile |
Firefox for Android |
IE mobile |
Opera Android |
iOS Safari |
---|---|---|---|---|---|---|---|
Basic Support |
(Yes) |
(Yes) |
(Yes) |
61 2 |
No |
11 |
73 |
max |
(Yes) |
(Yes) |
(Yes) |
6 |
No |
11 |
7 |
value |
(Yes) |
(Yes) |
(Yes) |
6 |
No |
11 |
7 |
标签 | Elements相关

超文本标记语言,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是,对于不同的浏览器,对同一标记符可能会有不完全相同的解释,因而可能会有不同的显示效果。