我遇到了一个问题，我正在努力寻找最佳解决方案。
我有一个非常矩形的 SVG，我有 3 个版本，例如桌面/平板电脑/手机
最初，我一直在使用<picture>带有标签的元素<source>并链接到 SVG。尽管以这种方式完成后，在移动 chrome 上，图像不会保留其矩形形状，而是将其强制为正方形。如果我设置了最大高度，那么所发生的一切就是 svg 图稿被压扁和模糊，并且 SVG 顶部和底部的空白区域仍然存在。
但是，在桌面上我从来没有遇到过这个问题。
当我将<svg>标签与<image>元素一起使用时，所有问题都消失了，只要我设置了最大高度，它就可以全面工作，尽管我无法以<picture>这种方式使用元素，这意味着我无法使用方便的媒体查询属性。
最后一件事，我还没有尝试过，因为我不希望它以这种方式实现，将 SVG 设置为块元素的背景。
我感谢任何有经验的输入，也许有人比我有更多的 SVG 跨平台知识！