首页 > 代码库 > 纯 CSS3实现圆形进度条动画

纯 CSS3实现圆形进度条动画

技术分享

悄悄地,GIF 格式的进度条已经越来越少,CSS 进度条如雨后春笋般涌现。今天要介绍的这个 CSS3 进度条,效果和 Flyme OS 4 上的加载动画一样。

首先,来看下最终的效果:

<iframe id="cp_embed_EamKyR" style="width: 100%; overflow: hidden;" title="CodePen Embed 2" name="CodePen Embed" src="http://codepen.io/cople/embed/EamKyR?height=268&theme-id=0&slug-hash=EamKyR&default-tab=result&user=cople" frameborder="0" scrolling="no" width="320" height="268"></iframe>

 

纯 CSS3实现圆形进度条动画