是否可以在 SVG 中使用 CSS 变量来操作元素的“属性样式”中的半径或位置等值？
例如，在下面的代码中，我添加了一个 CSS 颜色变量 ---dark-text-clr和一个半径变量--radius。当我在填充中使用颜色 CSS 变量时，它渲染得很好 - 第一个圆，但使用半径变量不会渲染元素 - 第二个圆。
:root{
--dark-text-clr: blue;
--radius: 12;
}<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px" viewBox="0 0 300 100">
<circle cx="9" cy="9" fill="var(--dark-text-clr)" mask="url(#moon-mask)" r=9 ></circle>
<circle cx="36" cy="20" fill="var(--dark-text-clr)" mask="url(#moon-mask)" r="var(--radius)" ></circle>
</svg>