percircle是一款简单实用的纯CSS百分比圆形进度条插件。你不需要做任何设置，只需要按该圆形进度条插件提供的标准HTML结构来编写代码，就可以生成一个漂亮的百分比圆形进度条。
首先要做的就是引入：使用该幻灯片插件需要在页面中引入jQuery和percircle.css以及percircle.js文件。
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/percircle.css" /> <script src="js/jquery-2.1.1.min.js"></script> <script src="js/percircle.js"></script> </head> <body> <div id="bluecircle" class="c100 p90 big"> <span>90%</span> <div class="slice"> <div class="bar"></div> <div class="fill"></div> </div> </div> <div id="orangecircle" class="c100 p100 orange"> <span>100%</span> <div class="slice"> <div class="bar"></div> <div class="fill"></div> </div> </div> </body> </html>
其中百分比是根据p90 这个修改 的，只需要需改p90就可以跟着修改样式 让图形百分比进行变化
另外有：基于SVG的扁平风格圆形进度条插件 地址http://www.htmleaf.com/html5/SVG/201508172426.html