根据纵横比调整/裁剪动画svg

我没有找到一种方法来对我的svg图像进行适当的裁剪。

首先，我是个新手

我尝试用position-absolute/relative在css中摆弄，但这个svg是用gsap设置动画的，这一事实使我无法将svg作为css中的背景图像加载

我还尝试过修改viewbox参数，但作为解决方案，它似乎有点复杂。我想知道这是否能起到反应

<div class="wrapper">
   <div class="nav-bar>
      "a nav bar here"
   </div>

   <div class="animatedSvg">
      <svg>
        the long svg code here of my fancy animated gsap.
      </svg>
   </div>
</div>

Css: elements are using flexbox for placement and sizing.
html, body{
    margin: 0;
    height: 100%;
}
.wrapper{
    display: flex;
    flex-direction: column;
    height: 100
}
.nav-bar{
display: flex;
    flex-direction: column;
}
.animatedSvg{
{
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
    background-color: black;
}

因此，答案是在摆弄高度、宽度和内联svg选项PreserveSpectratio

在内联svg的代码中有了这些，现在一切正常了：）

不清楚你的问题是什么。你想达到什么目的？很抱歉。我试图做到这一点：问题是，让svg在响应的同时做到这一点非常奇怪。我现在浏览这一页，试图找出一些问题：
`height="100%"
width="auto"
preserveAspectRatio="xMidYMin slice"`