如何创建梯形主要是弯曲矩形的右侧

Question

这是我的svg路径。我正在努力实现梯形。矩形的左边已经很好了。我想在右侧采用相同的方式。我该如何弯曲它？

<path d="M20 20  H 300 V 70 H 10 Z" fill="transparent" style="stroke:black; stroke-width:2"/>

这是我想要的形状的图像参考： http://amsi.org.au/teacher_modules/C3/C3g37.png

Answer 1

如果您不希望垂直线最好不要使用V，因为该命令会绘制它们。我用下面的L代替了V.

＆＃13;

＆＃13;

<svg width="100%" height="100%">
  <path d="M20 20  H 300 L 310 70 H 10 Z" fill="transparent" style="stroke:black; stroke-width:2"/>
</svg>

＆＃13;

＆＃13;

＆＃13;