我尝试实施几个指南来创建一个按百分比填充的圆圈，但我似乎无法让它工作（没有动画，只有静态 CSS 圆圈）。
圆形边框当前遵循background-image: linear-gradient我第一次设置为 a(90+(360*0.percent))deg和第二个设置为90deg. 它在前 50% 上运行良好，但除此之外它不会相应地填充。
.circle {
position: relative;
top: 5px;
left: 5px;
text-align: center;
width: 100px;
height: 100px;
border-radius: 100%;
background-color: #ffffff;
}
.circle-border {
position: relative;
text-align: center;
width: 110px;
height: 110px;
margin-left: 30%;
border-radius: 100%;
background-color: #E53B3B;
background-image: linear-gradient(162deg, transparent 50%, #f0f0f0 50%), linear-gradient(90deg, #f0f0f0 50%, transparent 50%);
}<div class="circle-border">
<div class="circle">
</div>
</div>linear-gradient当我希望圆圈填充超过 50% 时，应该更改哪些值？