使用剪辑路径从图像中剪切 SVG08
21

如果要使用 SVG 抠图，建议使用 CSS 属性`clip-path` 。以下脚本可以解决几个问题：SVG 可以使用 Illustrator 保存，您可以指定 SVG 的（相对或绝对）URL（Chrome 目前仅原生支持内联 SVG），而且抠图效果完全响应式。

首先，您在 Adob​​e Illustrator 中创建一个剪贴蒙版并使用以下设置导出 SVG:

SVG 和图像的宽高比应该相同。最后，在图像中引用外部 SVG，例如，在`data-clip`属性中。:

1e4823ee95525ce0e04bb693c48e0e35

现在您集成以下脚本:

1e4823ee95525ce0e04bb693c48e0e35

结果是:

See the Pen clip-path and SVGs by David Vielhuber (@vielhuber) on CodePen.

背部