svg 中的文本居中

时间:2021-03-07 14:48:37

标签: html css svg

我知道之前已经问过这个问题,但我看到的解决方案对我不起作用。 我有下面的代码,但正如您所看到的,文字不在圆圈中间

svg{
width :30%
}
.circle--out,.circle--in {
    fill: none;
}
.circle--out {
    stroke-width: 20px;
    stroke: black;
    z-index: 1;
}
.circle--in{
stroke-width: 10px;
    stroke: white;
    transform: rotate(-90deg);
    transform-origin: 50%;
 }
 .text{
  font-size:3rem;
 }
<svg class="circle_svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" data-class-link="myne" data-size="desktop">
                  <circle class="circle--out" cy="60" cx="60" r="50"></circle>
                  <circle class="circle--in" cy="60" cx="60" r="50" style="stroke-dasharray: 301.2, 313.652; animation-name: circleAnimation;"></circle>
                <text class="text" x="50%" y="50%" alignment-baseline="middle" text-anchor="middle" style="
    font-size: 4rem;
">99</text></svg>

1 个答案:

答案 0 :(得分:1)

使用 /root/.m2 代替中间

相关问题