Html 我想将svg图像的大小调整为屏幕宽度的100%。然后，高度应溢出，保持原始高度/宽度比

我将svg世界地图放在网站上（我在代码中只留下了一条路径（国家/地区）：

.mapcontainer{高度：120%；宽度：100%；}

---

我在svg中添加了一个rect，以查看它是如何填充div的。 然后我使用innerWidth/innerHeight设置svg的宽度和高度：

document.addEventListener（“onload”，init（），false）
函数init（）{
var svgW=窗内宽度
var svgH=window.innerHeight
svg2.setAttribute（“宽度”，svgW）
svg2.setAttribute（“高度”，svgH）
}

CSS中有一个新的度量单位称为vw，或视口宽度——您可以通过将其样式设置为高度来固定纵横比：120vw，只要它填充视口宽度的100%。

您可能想要的是在svg上将

保留Aspectratio

指定为

切片，并且只在css中指定
width

通过在svg上只设置宽度（而不是高度），浏览器将自动保持纵横比

您可能还希望在CSS中设置100%的
最小高度

（我添加了一个红色边框以查看发生了什么）


.mapcontainer{宽度：100%；}

我看到div没有关闭，也不明白为什么xml utf在“空间”中。能再给我们看一点你的代码吗？。谢谢汉克斯·弗朗西斯。我删除了不必要的代码并添加了其余代码。我删除了viewBox并在svg中包含了width=“950”和height=“620”。我没有所有的路径可供评估，但对我来说似乎还可以。谢谢你的帮助！但是，恐怕我不明白如何处理第二段代码。这是怎么一回事？