如何使用canvas或css绘制形状？

Question

我正在寻找一种用html（css）或画布创建这种形状的方法。

感谢。

Answer 1

试试这个：

<script>
  var canvas = document.getElementById('myCanvas'),
      context = canvas.getContext('2d'),
      startAngle = 1.2 * Math.PI,
      endAngle = 0.8 * Math.PI;

  context.beginPath();
  context.moveTo(50, 70);
  context.lineTo(250, 70);
  context.arc(300, 100, 50, startAngle, endAngle, false);
  context.lineTo(50, 130);
  context.closePath();
  context.lineWidth = 5;
  context.strokeStyle = 'blue';
  context.stroke();
</script>

有关详细信息，请查看here