如何使内联 SVG 始终填满屏幕？

Question

我创建了一个矢量图像，我想将其用作我的网站的英雄。它应该填充所有分辨率下视口的宽度和高度。

此外，我需要能够通过 CSS 或 JavaScript 对 SVG 元素进行动画处理，因此将其作为 css 背景或 img 插入不是一个选项（至少据我所知）。

你们知道解决这个问题的方法吗？这张图显示了我想要实现的目标：

任何帮助将不胜感激！

Answer 1

感谢罗伯特·朗森的评论，让它发挥作用：申请preserveAspectRatio="xMidYMid slice"对 SVG 应用 100% 宽度和高度是有效的。