使用背景图像填充 SVG 路径元素

Question

是否可以为 SVG <path> 元素设置 background-image？

例如，如果我设置元素 class="wall"，则 CSS 样式 .wall {fill: red;} 有效，但 .wall{background-image: url(wall.jpg)}没有，.wall {background-color: red;} 也没有。

Answer 1

您可以通过将背景设置为图案来实现：

根据您的图像调整宽度和高度，然后从路径中引用它，如下所示：

工作示例