HTML5 progress进度条详解

最新推荐文章于 2024-07-06 17:55:28 发布

三人行，必有我师！！！

最新推荐文章于 2024-07-06 17:55:28 发布

阅读量860

点赞数

分类专栏： H5

原文链接：https://blog.csdn.net/pingwei_deng/article/details/80654696

版权

H5 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

<progress class="process" value='70' max='100'></progress>





.process{background:#F9F9F9;border:1px solid red;border:2px solid #000;width:200px;height:10px;-webkit-appearance: none;border-radius: 5px;}
::-ms-fill{background:linear-gradient(270deg,rgba(24,222,248,1) 0%,rgba(38,164,254,1) 100%);border-radius: 5px;}
::-moz-progress-bar{background:linear-gradient(270deg,rgba(24,222,248,1) 0%,rgba(38,164,254,1) 100%);border-radius: 5px;}
::-webkit-progress-bar{background:#F9F9F9;border-radius: 5px;}
::-webkit-progress-value{background:linear-gradient(270deg,rgba(24,222,248,1) 0%,rgba(38,164,254,1) 100%);border-radius: 5px;}