HTML5新控件 - 进度条<progress>

来源:互联网 发布:手机上网代理软件 编辑:程序博客网 时间:2024/06/07 11:35

<progress>表示任务的进度,背景为灰色,完成的部分填充为脉动式绿色条(但不同的浏览器下,样式还是不同的)。

这里写图片描述

1,可以通过value属性来设置百分比(0~1的小数)
通常我们还可以在元素内部再放置进度值,这样当浏览器不支持的时候就可以显示出文字作为后备方案。

<progress value="0.25">25%</progress>

2,可以利用max属性设置最大值,这时value的范围便是0~最大值

<progress value="25" max="100">25%</progress>

3,如果不设置value值,则表示不确定的进度条(进度会不断循环的滑动)

这里写图片描述

<progress></progress>
0 0
原创粉丝点击