我正在浏览circliful.js的源代码，我遇到了以下几行代码：
error! Error: x假设textX和textY的值分别是常量'<text class="timer" text-anchor="middle" x="' + textX + '" y="' + textY
+ '" style="font-size: ' + settings.percentageTextSize + 'px; ' + additionalCss + ';'
+ settings.textAdditionalCss + '" fill="' + settings.fontColor + '">0%</text>'
和175，那么当圆的宽度发生变化时，图标的位置如何保持不变。
基本上上面的代码行是您在 FIDDLE HERE 中看到的百分比值，您在小提琴中看到的35就是上面的代码行。
所以，当我有以下css时：
50%尽管#circli {
max-width: 400px;
}
和175的值保持不变，但50％的位置仍然在同一位置，如果我更改了这样的CSS：
35 #circli {
max-width: 200px;
}
的位置仍然与50%和175具有恒定值的灵感相同，有人可以解释原因吗？
谢谢。
答案 0 :(得分：0)
SVG中的元素在常量坐标系中定义。您所做的只是改变SVG所在的<div>的大小。 SVG会自动缩放以适合div。
SVG正在扩展，因为它有一个viewBox。 viewBox告诉渲染器SVG文档的限制是什么，并触发自动缩放。如果它没有viewBox，则不会自动调整大小。