是否可以＆＃34;规模＆＃34;一个使用viewBox属性的SVG（因此所有路径保持完整和相对）但只增加宽度或高度，而不会影响其中一个或哪一个？
例如，我有一个像这样的SVG（我删除了关于渐变的代码）：
<svg viewBox="0 0 300 282.47437" class="panel-2">
<g transform="translate(-200,-356.72993)" id="layer2">
<path d="m 200,639.2043 300,0 0,-280.56692 c 0,0 -54.42824,-13.38012 -149.6732,30.73468 C 273.74938,424.84057 200,398.89784 200,398.89784 z"
id="path3067"
style="fill:url(#radialGradient3909);fill-opacity:1;stroke:none" />
</g>
</svg>
但如果您调整窗口大小，它会同时缩放高度和宽度。我是否可以将其隔离为仅调整其中一个属性或通过CSS设置max-height:300px这样的上限？
我想＆＃34;伸展＆＃34;它，所以宽度会增加，但不会增加高度，因为帆布放大，保持路径的机智。这可能吗？
答案 0 :(得分：5)
将svg元素设为固定height="282.47437"和width="100%"并设置preserveAspectRatio="none"。
<svg viewBox="0 0 300 282.47437" class="panel-2" height="282.47437" width="100%" preserveAspectRatio="none">
<defs id="defs3053">
<linearGradient id="linearGradient3897">
<stop id="stop3899" style="stop-color:#282828;stop-opacity:1" offset="0" />
<stop id="stop3901" style="stop-color:#161616;stop-opacity:1" offset="1" />
</linearGradient>
<radialGradient cx="214.41734" cy="475.73941" r="150.5" fx="214.41734" fy="475.73941" id="radialGradient3909" xlink:href="#linearGradient3897" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0.2897714,1.1015688,-1.5801648,0.73906298,951.79987,-143.74246)"
/>
</defs>
<g transform="translate(-200,-356.72993)" id="layer2">
<path d="m 200,639.2043 300,0 0,-280.56692 c 0,0 -54.42824,-13.38012 -149.6732,30.73468 C 273.74938,424.84057 200,398.89784 200,398.89784 z" id="path3067" style="fill:url(#radialGradient3909);fill-opacity:1;stroke:none" />
</g>
</svg>