This question already has answers here:
Fill SVG path element with a background-image
（2个答案）
在8个月前关闭。
我正在尝试创建一个具有内联SVG的HTML，该内联SVG的元素具有CSS背景：
对于
这是为什么？
我最终想要实现的是将Sprite图像作为SVG中多个图像的背景
编辑：最终我希望填充是大图像的一部分，而不仅仅是
以供参考
这些是通常用于rect的属性：
剪切路径，剪切规则，颜色，颜色插值，颜色渲染，光标，显示，填充，填充不透明度，填充规则，滤镜，蒙版，不透明度，指针事件，形状渲染，笔触，笔触dasharray，stroke-dashoffset，stroke-linecap，stroke-linejoin，stroke-miterlimit，stroke-opacity，stroke-width，transform，vector-effect，visible
（2个答案）
在8个月前关闭。
我正在尝试创建一个具有内联SVG的HTML，该内联SVG的元素具有CSS背景：
<html>
<body>
<svg>
<foreignObject width="50" height="50">
<div style="red; width:50; height:50"></div>
</foreignObject>
<rect width="50" height="50" transform="translate(100,0)" style="red"/></svg>
</body>
</html>
对于
foreighObject，显示背景，但不显示rect这是为什么？
我最终想要实现的是将Sprite图像作为SVG中多个图像的背景
编辑：最终我希望填充是大图像的一部分，而不仅仅是
red。似乎仅fill是不可能的 最佳答案
style =“ red”看起来不正确，正确的方式是“ fill：red”或“ fill：＃00562”;
<!-- Simple rectangle -->
<rect width="100" height="100" fill="red"/><svg viewBox="0 0 220 100" xmlns="http://www.w3.org/2000/svg">
<!-- Simple rectangle -->
<rect width="100" height="100" fill="red"/>
</svg>以供参考
这些是通常用于rect的属性：
剪切路径，剪切规则，颜色，颜色插值，颜色渲染，光标，显示，填充，填充不透明度，填充规则，滤镜，蒙版，不透明度，指针事件，形状渲染，笔触，笔触dasharray，stroke-dashoffset，stroke-linecap，stroke-linejoin，stroke-miterlimit，stroke-opacity，stroke-width，transform，vector-effect，visible
关于html - SVG元素的CSS背景，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56426722/
10-13 01:42