使用jquery的SVG视图框裁剪

我正在为我的客户做贴纸网站。 他们需要在给定的SVG图像中进行图像裁剪。 这个SVG图像不像万圣节那样(见下文)。

在此处输入图像描述

当我上传图像时,它将显示在给定图像中。 图像的其余部分将隐藏。

我怎样才能做到这一点?

使用SVG clipPaths非常容易。 除了IE之外,它还具有良好的浏览器支持。

.defs { position: absolute; width: 0; height: 0; } .demo { text-align:center; } .star image { clip-path: url(#star-clip); } .hex image { clip-path: url(#hex-clip); } .heart image { clip-path: url(#heart-clip); } .shape image { clip-path: url(#shape-clip); }