HTML <progress> 标签

介绍

HTML <progress> 标签用于显示任务的进度,通常在下载或操作完成前,会展示一个动态的进度条。这个元素可以让开发者提供一种视觉反馈,告诉用户当前应用正在处理事情,而不是冻结或没有响应。

语法

<progress value="数值" max="最大值">
  您的浏览器不支持 progress 标签。
</progress>
  • value: 当前进度,必须是一个0到max之间的数字。
  • max: 任务的总量,默认为1。如果没有指定max属性,则value需要在0到1之间。

示例

下面是一个简单的例子:

<progress value="50" max="100"></progress>

这将创建一个进度条,当前进度为一半。

注意事项

  • <progress> 标签不应用于指示活动的状态,而是用来显示任务完成的百分比。
  • 如果没有提供value属性,进度条将会展示一个动态的、未确定的进度效果。这种情况下,最好也不要指定max属性。
  • <progress> 标签在所有现代浏览器中都得到了很好的支持,但是IE和Edge浏览器直到18版本才开始支持这个元素。