如何使

目标是拥有<svg>元素扩展到其父容器的大小，在本例中为<div>，无论容器有多大或多小。

代码：

<style>
    svg, #container{
        height: 100%;
        width: 100%;
    }
</style>

<div id="container">
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" >
         <rect x="0" y="0" width="100" height="100" />
    </svg>
</div>

这个问题最常见的解决方案似乎是设置viewBox属性上的<svg>元素。

viewBox="0 0 widthOfContainer heightOfContainer"

然而，这似乎不适用于以下情况：<svg>元素具有预定义的宽度和/或高度。例如，<rect>在上面的代码中，元素的宽度和高度已明确设置。

因此，显而易见的解决方案是在这些元素上也使用％宽度和％高度。但这是必须要做的吗？特别是从<img src=test.svg >工作正常并且扩展/收缩没有任何显式设置的问题<rect>高度和宽度。

如果元素像<rect>以及其他类似的元素，必须以百分比定义其宽度和高度，Inkscape 中是否有一种方法可以设置它，以便所有具有<svg>文档使用百分比宽度、高度等而不是固定尺寸？

The viewBox不是容器的高度，而是绘图的大小。定义你的viewBox宽度为 100 个单位，然后定义您的rect为10个单位。之后，无论您将 SVG 缩放到多大，rect将为图像宽度的 10%。