HTMLProgress元素是HTML5中新增的元素,它用于显示任务的进度。它可以用来显示任务的完成情况,例如下载文件、上传文件、播放视频、游戏进度等。
<progress value="50" max="100">50%</progress>
上面的代码将显示一个水平进度条,表示当前进度为50%,最大值为100%。value属性表示当前进度,max属性表示最大值。
<progress value="50" max="100"> <span class="percentage">50%</span> </progress>
上面的代码中使用了span标签来显示当前进度,可以使用CSS来设定span标签的样式,例如字体大小、颜色、位置等。
progress元素可用于指示任务的逐渐完成。它有两个局部属性: value,max,form
。
value属性定义当前进度,它在零和max属性的值之间。
当省略max属性时,比例在0和1之间。使用浮点数表示进度,例如30%的0.3。
下面的代码显示了progress元素和一些按钮。按下按钮可更新progress元素显示的值。
<!DOCTYPE HTML>
<html>
<body>
<progress id="myprogress" value="10" max="100"></progress>
<p>
<button type="button" value="30">30%</button>
<button type="button" value="60">60%</button>
<button type="button" value="90">90%</button>
</p>
<script>
var buttons = document.getElementsByTagName("BUTTON");
var progress = document.getElementById("myprogress");
for (var i = 0; i < buttons.length; i++) {
buttons[i].onclick = function(e) {
progress.value = e.target.value;
};
}
</script>
</body>
</html>
本章为大家带来的是HTML引用的使用方法教程,内含引用实例及常用引用方式介绍。这是摘自 WWF 网站的引文:五十年来,WWF 一直致...
HTML 颜色名目前所有浏览器都支持以下颜色名。 141 个颜色名称是在 HTML 和 CSS 颜色规范定义的( 17 标准颜色,再加 124 )。下...
HTML 元素HTML 文档由 HTML 元素定义,HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。HTML 元素开始...
AJAX - 创建 XMLHttpRequest 对象 XMLHttpRequest 是 AJAX 的基础。 XMLHttpRequest 术语缩写为XHR,中文可以解释为可扩展超文...