HTML5 <progress> 标签

<progress> 标签用于表示任务的进度或进程的完成百分比。它是一个内联元素,可以在文档中的任何位置使用。

属性

  • value: 指定进度条的当前值。
  • max: 指定进度条的最大值。

示例代码

-- -------------------- ---- -------
--------- -----
------
------
    --------------- --- ---------------
-------
------
    -------- ------ -------------
    --------- ---------- ---------------------
-------
-------
展开代码

在上面的示例中,我们创建了一个简单的进度条,表示文件上传的进度为 50%。

支持性

<progress> 标签在现代浏览器中得到很好的支持,包括 Chrome、Firefox、Safari 和 Edge 等。

注意事项

  • <progress> 标签不支持 IE 浏览器,如果需要兼容性,可以考虑使用 JavaScript 或 CSS 实现进度条效果。
  • 应该根据实际任务的进度和完成情况来动态更新 <progress> 标签的 value 属性,以确保用户能够准确地看到进度。
属性 描述
max number 规定需要完成的值。
value number 规定进程的当前值。
纠错
反馈

纠错反馈