SVG - 背景大小不调整 SVG 图像的大小，而是改变它的位置答案

【问题标题】：SVG - Background size not resizing SVG image, instead its changing it's positionSVG - 背景大小不调整 SVG 图像的大小，而是改变它的位置
【发布时间】：2020-06-22 12:30:14
【问题描述】：

我正在尝试使用背景大小属性来像这样缩放我的背景图像

.myDiv
  background-image url('background-fill.svg')  
  background-repeat no-repeat
  background-size 100% 336px

但更改 336px 并不会重新缩放图像的高度，而是始终按比例缩放图像（添加到 336px 会使图像向下移动，从 336px 中减去会使图像向上移动，它不会改变图像的大小）

例如，如果我这样做

  background-size 100% 536px

图像向下移动，并显示与之前相同的大小

如果我更改为 png 或 jpg，它会按预期工作

【问题讨论】：

寻求代码帮助的问题必须包含重现它所需的最短代码在问题本身中最好在Stack Snippet 中。见How to create a Minimal, Reproducible Example
除了根据之前的评论提供您的 HTML 和 CSS 之外，您是否也可以提供 SVG/XML？至少，我们需要查看您的 SVG 在 SVG 文件本身中为宽度、高度、viewBox 和 preserveAspectRatio 设置了什么。这些可能会影响 SVG 的大小/缩放方式。
@HBlackorby 我发现了问题，我将其发布为我自己问题的答案。需要将 preserveAspectRatio="none" 设置为我的 svg。谢谢

标签： css svg background-size

【解决方案1】：

我发现了问题，我不得不设置

preserveAspectRatio="none"

在我的 .svg 中，在 svg 标签内

【讨论】：