svg - SVG 根元素的默认背景颜色

Question

我想为整个 SVG 文档设置默认背景颜色，例如红色。

<svg viewBox="0 0 500 600" style="background: red">/* content */</svg>

上面的解决方案有效，但不幸的是样式属性的背景属性不是标准的:http://www.w3.org/TR/SVG/styling.html#SVGStylingProperties ，因此它会在使用 SVG Cleaner 的清理过程中被删除。

还有其他方法来声明此背景颜色吗？

Answer 1

SVG 1.2 Tiny 有 viewport-fill我不确定这个属性的实现有多广泛，因为大多数浏览器目前都以 SVG 1.1 为目标。 Opera 实现了 FWIW。

目前，更跨浏览器的解决方案是粘贴 <rect>宽度和高度为 100% 且 fill="red"的元素作为 <svg> 的第一个子元素元素，例如:

<rect width="100%" height="100%" fill="red"/>