HTML progress控件

progress控件

progress控件用来定义一个进度条，用来表示页面中某个任务完成的进度。

progress控件可以是确定的进度，则当前进度是介于某个最小值与最大值之间的值。这种情况下，进度条处于一个静止状态。

<progress min="0" max="100" value="35"></progress>

则表示进度值介于0到100之间，当前进度是35。则进度条静止在35的地方，如图 3‑28 所示：

图3-28 progress控件

progress控件也可以是不确定的进度，仅表示任务正在进行中，而不知道什么时候结束。这种情况下，浏览器默认会显示一个活动的进度条，仅表示任务正在进行中。当然，也可以通过Javascript来更新进度，实现真正的进度条。

progress控件具有可读写value、max两个属性：

value属性表示任务已完成的进度值，可通过DOM元素progress.value进行操作；
max属性表示任务所需的总进度值，可通过DOM元素progress.max进行操作；

对于一个确定性的任务，只要能知道已完成进度值及总进度值，就可以通过Javascript实现真实的动态进度条（Javascript超出我们的讨论范围，这里就不提供Javascript代码了）。

关于作者

歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》，并全部在 GitHub 上开源。

HTML progress控件相关推荐

android 成长日记 5.关于progress控件和Alertdialog和layout学习
2019独角兽企业重金招聘Python工程师标准>>> 今天想实现一个工具类就是DialogUtil.方便大家建立各种dialog; public class DialogUtil ...
HTML5 progress和meter控件
HTML5 progress和meter控件在HTML5中,新增了progress和meter控件.progress控件为进度条控件,可表示任务的进度,如Windows系统中软件的安装.文件的复制等 ...
JavaFX UI控件教程（十八）之Progress Bar和Progress Indicator
翻译自 Progress Bar and Progress Indicator 在本章中,您将了解进度指示器和进度条,以及可视化JavaFX应用程序中任何操作进度的UI控件. 本ProgressIn ...
VC控件 Progress Control
m_progress->GetPos(); //获取进度条的当前位置 m_progress->GetRange(int min,int max); //获取进度条控件的范围的下限和上限 m ...
Progress Control控件的使用
1.设置控件的属性在smooth默认是false,表示进度条是一格一格变化,设置成true的话,就相当于水流一样变化,不过我测试的时候win7里好像一样,没变化,但是在XP里有区别. 属性smoot ...
使用ASP.NET Atlas编写显示真实进度的ProgressBar（进度条）控件
当后台在进行某些长时间的操作时,如果能在页面上提供一个显示真实进度的进度条,而不是让用户不知情的等待或是从前的那些简单的估计,将是一个非常难得的出彩之处.现在使用ASP.NET Atlas完全有可能做 ...
web 前端常用组件【06】Upload 控件
因为有万恶的IE存在,所以当Web项目初始化并进入开发阶段时. 如果是项目经理,需要知道客户将会用什么浏览器来访问系统. 明确知道限定浏览器的情况下,你才能从容的让手下的封装必要的前端组件. 本篇文章 ...
集成 Kendo UI for Angular 2 控件
伴随着 Angular 2 的正式 release,Kendo UI for Angular 2 的第一批控件已经发布了,当前是 Beta 版本,免费使用. 官方站点:Kendo UI for Ang ...
UI整理-----part2--UI控件
1.label (1)label的默认行数是1,可以通过label.numberOfLines = 0 实现自动换行 (2)通过 [label sizeToFit] 可以让label根据text适当设 ...

HTML progress控件

progress控件

HTML progress控件相关推荐

最新文章

热门文章