Progress实现进度条效果

Posted 2022-04-17 算法与编程之美

简介

在加载网页时，如在打开谷歌、百度时，当网速较低时浏览器地址栏的下方就会出现蓝色的进度条，而不是在地址栏里面出现进度条。通过进度条可以让用户比较准确判断网页加载的进度，决定是否继续加载。但是现在运用最多的应该是文件下载的时候（如视频文件、音频文件等），用来显示下载进度。

Progress概述

在html中，Progress标签是HTML5中新增的标签，是使用来定义运行中的任务进度或进程的，通常和javascript一起使用来实现进度条。Progress标签属性为max和value。（max：规定需要完成的值；value：规定进程的当前值）。

Progress用法

在利用bootstrap制作的过程中，先设置一个

作为进度槽。然后在设置一个 作为进度条。

（1）制作默认的静态进度条，（ style=“width:30%”; 表示进度条在 30% 的位置）。

<div>

     <div