Html 使用svg笔划作为剪辑路径_Html_Css_Svg_Clip Path

Html 使用svg笔划作为剪辑路径

html css svg

Html 使用svg笔划作为剪辑路径,html,css,svg,clip-path,Html,Css,Svg,Clip Path,我希望有一个空心圆作为剪辑路径，但当我应用遮罩时，覆盖的区域是整个圆。有什么方法可以获得这种效果？（像边界半径的边界：50%div）剪辑路径：url（#剪辑）正如您所发现的，只使用形状的填充改用。我不能将笔划用作剪辑路径。。 <svg class="svg-defs"> <defs> <clipPath id="clipping"> <circle cx="100" cy="50" r="40"

我希望有一个空心圆作为剪辑路径，但当我应用遮罩时，覆盖的区域是整个圆。有什么方法可以获得这种效果？（像边界半径的边界：50%div）

剪辑路径：url（#剪辑）

正如您所发现的，

只使用形状的填充

改用

。

我不能将笔划用作剪辑路径。。

<svg class="svg-defs">
    <defs>
        <clipPath id="clipping">
            <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="none" />
        </clipPath>
    </defs>
</svg>