Html SVG“viewbox”应该在“symbol”中定义一次，还是每次“使用”SVG时定义一次？

根据我读到的内容，当插入带有

的SVG

时，只需在

标记中定义一次

viewBox

属性

这在名义上可以正常工作，但是

元素的内容会以相当大的比例溢出父元素

（显然总是父svg元素大小的比例，尽管它似乎根据CSS样式而有所不同）。这似乎不会导致任何实际问题（溢出隐藏，因此没有不需要的滚动条或布局问题），但不知何故它感觉“错了”

去年这里有一个问题的答案，它建议从

元素中完全删除

viewbox

属性，并在

标记中声明它。这样做意味着所有内容都会100%地显示出来，但是从我收集的

标记的优点之一是，它应该意味着

视图框只需要声明一次，而不是每次插入都要声明一次

我试着比较不同的用例

有正确的做事方法吗？这是正常的，可以忽略吗？还是我做了一些根本错误的事情

编辑：看起来像是仅在
中设置了
viewbox
属性时，它也会放大整个父svg标记。SVG维度是否应明确设置为每个
使用
？
TL；DR：如果未为svg标记指定任何viewBox属性，则无论
高度
或
宽度
值如何，它都无法正确缩放

因为在同一个SVG中可以有多个符号，例如（简化代码）



每个符号都可以有自己的大小*。现在SVG标记（根）还需要知道应该使用哪个大小*。因此，必须在SVG标记本身上设置一个viewBox

*我们不应该称之为“大小”，而应该称之为“面积”、“边界框”或简单的“视图框”

如果仅使用一个符号，则很可能会选择与目标符号相同的视口。通过这种方式，SVG将像



<svg>
<use href="somePath#symbol1"></use>
<use href="somePath#symbol2"></use>
</svg>

<svg viewBox="0 0 32 32">
<use href="somePath#anIcon32x32"></use>
</svg>