根据此article和this article,如果您没有指定内部SVG的宽度和高度,它应该自动扩展外部SVG的宽度和高度。
此HTML:
<html>
<head></head>
<body>
<svg width="100%" height="100%">
<svg>
<path d="M470.3,204.3 l-1,-2.3 -0.5,-1.6 -2.9,-1.6 -4.8,-1.5 -2.2,-1.2
-2.6,0.1 -3.7,0.4 -4.2,1.2 -6,-4.1 -2.2,-2 -10.7,0.6 -41.5,-2.4
-35.6,-2.2 -4.3,43.7 33.1,3.3 -1.4,21.1 21.7,1 40.6,1.2 43.8,0.6 h4.5
l-2.2,-3 -2.6,-3.9 0.1,-2.3 -1.4,-2.7 -1.9,-5.2 -0.4,-6.7 -1.4,-4.1
-0.5,-5 -2.3,-3.7 -1,-4.7 -2.8,-7.9 -1,-5.3z" id="a state"
fill="#000000" />
</svg>
</svg>
</body>
</html>
结果
注意:我使用的是最新的Chrome浏览器。
正如您所看到的,内部SVG没有扩展以填充外部SVG,如上文所述,即使内部SVG上未指定高度和宽度。我曾尝试弄乱preserveAspectRatio
atrribute而无济于事(根据我的理解,它应该无关紧要)。
我错过了什么?
感谢您的帮助,如果我遗失任何内容或需要提供更多信息,请告知我们。