一个 div 实现扇形图（锥形渐变）

需要引用的js文件
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<script src="http://leaverou.github.io/conic-gradient/conic-gradient.js"></script>

css样式
.bt {
    width: 99px;
    height: 99px;
    border-radius: 50%;
   background:conic-gradient(#F7CD07 50%,#A6E33C 50% ,#A6E33C 100%)
}
.bt1 {
    width: 99px;
    height: 99px;
    border-radius: 50%;
    background:conic-gradient(#A6E33C 33.33% ,#F7CD07 33.33%, #F7CD07 66.66%,#666 66.66%, #666 100%)
}
div容器

<div class="bt"></div>
<div class="bt1"></div>

相关资料
http://leaverou.github.io/conic-gradient/

转载于:https://www.cnblogs.com/chenxilin/p/6098405.html