我创建了带有填充描边颜色的圆圈的 SVG 图像。我无法从顶部位置逆时针方向填充颜色。如何用内联CSS逆时针方向填充(需要使用内联CSS来做)。我在小提琴中尝试过,添加后它就可以工作:
transform="rotate(-90deg)"
Run Code Online (Sandbox Code Playgroud)
它适用于 Linux 浏览器,但不适用于 Windows Chrome。
transform="rotate(-90deg)"
Run Code Online (Sandbox Code Playgroud)
如何使用内联 CSS 在 Windows Chrome 浏览器中从 SVG 圆圈的顶部位置(从 12 点钟开始)填充颜色?
SVG 代码:
<svg width="100" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<circle cx="60" cy="60" r="24" fill="none" stroke="#e6e6e6" stroke-width="12" />
<circle cx="60" cy="60" r="12" fill="none" stroke="red" stroke-width="26" stroke-width="12" stroke-dasharray="65" stroke-dashoffset="0" transform-origin="center"/>
</svg>Run Code Online (Sandbox Code Playgroud)