我的文档中有一个SVG元素,通过css有100％的宽度.这只会重新调整svg元素的大小;它没有调整路径的大小.这是我的路径代码：
<path id="quadcurveABC" d="M 0 300 q 300 0 500 -100 l 0 100 z" stroke="black" stroke-width="2" fill="black" />
我需要将M的x分量排列在屏幕的左侧,它也是,但我还需要500的q 300 0 500 -100才能对着屏幕的右侧.我怎么做到这一点？
解决方法
为SVG元素指定一个
viewBox attribute,指定要显示的内容：
<svg … viewBox="0 200 500 100">
这基本上说,“这个图像的内容是500个单位宽,100个单位高,从0x,200y开始;请务必保持可见”
看到行动：
有关如何在CSS指定的宽高比与viewBox的宽高比不匹配时进一步控制图像裁剪,缩放和对齐的详细信息,请阅读preserveAspectRatio attribute.
