javascript - 在圆圈内裁剪base64图像数据

Question

我有一张占据整个屏幕的图像。我只需要保存图像的一小部分，比如顶部 25% 的 300px 宽度和高度的内容。我附上了一个我找到的例子。

在示例中，您可以看到图像顶部有一个小圆圈，在接下来的部分中，仅显示圆圈内的内容。我怎样才能做到这一点？

Answer 1

您可以使用属性 border-radius

.circular {
  width: 80vw;
  border-radius: 50%
}

<img class="circular" src="https://i.imgur.com/VUychin.png">

可以在src参数上使用base64图片，这个是一样的。