Html 与img标记嵌入时一样拉伸SVG内联标记

在一个页面中，我有一个svg图像直接嵌入到html中，我希望这个svg在响应设计中始终保持100%的宽度，并保持原始比例

我尝试过使用PreserveSpectratio，但我无法拉伸宽度图像以保持比例，就像在嵌入带有img标记和外部svg文件的图像时一样

A）Svg直接在HTML中嵌入Svg元素：
B） 使用img元素的Svg：

我希望示例A具有与示例B相同的行为，但是如何

---

应该至少在Chrome和Safari上可见，在您的ViewBox元素中，您必须使用数字来适应它

viewbox属性具有以下属性：

min-x min-y width height

但这在svg中它自己的网格系统的范围内

这篇文章应该会有所帮助

---

在chrome上对我来说很好。请在宽窗口中查看。这是代码版本的JSFIDLE嵌入式视图：我在Firefox Mac/Win上测试了它，并且工作正常，但是。。不幸的是，在Chrome Mac/Win/Android上，Safari Mac/iOS无法正常工作您的图像无法显示，期望的结果是什么？一个真正高的图像，其跨度为100%？图像应延伸至可用宽度的100%，并“自动”按比例计算高度。。当svg嵌入了img标记，并且width=“100%”Re没有回答帮助时，就会发生这种情况。不是精确的解决方案，但它会让你找到正确的解决方案。

min-x min-y width height