SVG 元素高度不超过 150 像素答案

【问题标题】：SVG element height not scaling past 150pxSVG 元素高度不超过 150 像素
【发布时间】：2017-06-17 03:00:49
【问题描述】：

我在网上看到了几篇关于 SVG 高度的默认大小如何为 150 像素的帖子，但我找不到关于如何解决这个问题的明确答案。

<body>
<svg width='100%' height='100%'></svg>
</body>

我要做的就是将 SVG 缩放到窗口的大小，但在 1% 或 1000% 时，高度始终为 150 像素。

【问题讨论】：

尝试改变身体高度body{height:100vh;}
另外，在文本编辑器中打开您的 SVG 并确保删除视图框和定义的任何固定高度或宽度。然后保存 svg 并重试。如果您想永久控制它，您希望在 CSS 中定义所有内容，而不是在 SVG DOM 中。
冷却你这个漂亮的混蛋。谢谢您的帮助。你们俩。
Korgue 的建议并非完全有效。您不能使用 CSS 重新定义 viewBox。

标签： javascript html css svg

【解决方案1】：

评论中已经有一些答案，但我会在这里放一个。问题是，如果您的父容器没有自己的高度值，那么它只会与其中的内容一样大。如果你的 SVG 默认是 150px，你的 body 是 150px，给 svg 足够的空间。 150 的 100% 是……嗯，150。Chiller 的 height:100vh; 会将你的身体扩大到窗户的高度，使你的 svg 也那么大。您可以通过将 SVG 放在 div 中或为 SVG 提供固定尺寸来对其进行缩放。

【讨论】：