SVG RECT 宽度和高度为 100%

Question

我正在创建一个 SVG 元素，并且想更改它的背景颜色。根据 this question, and as per W3C recommendations, background-color is not a standard style for SVG, but fill must be used instead. However, fill does not work and the most common solution 是在 svg 元素内创建一个 rect 元素，并使该矩形元素的宽度和高度类似于 svg.

因此，以下是建议解决方案的结果：

<svg width="300" height="200">
    <rect width="300" height="200" style="fill: rgb(0, 255, 0);></rect>
</svg>

然后我将其更改为：

<svg width="300" height="200">
    <rect width="100%" height="100%" style="fill: rgb(0, 255, 0);"></rect>
</svg>

（请注意，我在第二次尝试中将 width 和 height 设置为 100%）。

现在我的问题是：尽管这可行，但使用宽度和高度的百分比是 W3C 标准吗？还是黑客攻击？

谢谢。

Answer 1

is using percentages in width and height a W3C standard?

是的。根据https://www.w3.org/TR/SVG/coords.html:

The supported length unit identifiers are: em, ex, px, pt, pc, cm, mm, in, and percentages.

SVG RECT 宽度和高度为 100%

SVG RECT Width and Height of 100%

w3c

svg

background-color

fill