如何在带有文字的圆圈内画一个圆圈[重复]答案

【问题标题】：How to draw a circle inside a circle with text [duplicate]如何在带有文字的圆圈内画一个圆圈[重复]
【发布时间】：2022-03-11 20:18:39
【问题描述】：

我想用 HTML 和 CSS 创建它。它应该与照片中的完全相同。能否请你帮忙？提前致谢。

enter image description here

【问题讨论】：

dev.to/shantanu_jana/…

标签： html css css-shapes

【解决方案1】：

.code-copy {
  position: relative;
  display: flex;
  height: 200px;
  width: 200px;
}

.code-copy span {
  display: flex;
  font-size: 31px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  align-items: center;
  justify-content: center;
}

<div class="code-copy">
  <svg xmlns="http://www.w3.org/2000/svg" id="sv" width="200" height="200" viewBox="0 0 200 200">
    <path id="0" fill="#D1E6BC" d="M100, 0 A100,100 0 0 1 163.357335318736,177.36826262305007 L131.678667659368,138.68413131152505 A50,50 0 0 0 100,50 Z"></path>
    <path id="1" fill="#94CD8B" d="M163.357335318736, 177.36826262305007 A100,100 0 1 1 99.98254670756873,0.0000015230870928917284 L99.99127335378436,50.000000761543546 A50,50 0 1 0 131.678667659368,138.68413131152505 Z"></path>
  </svg>
  <span>75%</span>
</div>

【讨论】：