将图像显示为圆形

Question

我找到了用CSS3做到这一点的方法，但IE仍然不支持它。我想知道是否有办法做到这一点，以便它可以与所有流行的浏览器兼容。 我知道我可以用面具来做，但如果我想在后台显示用户上传的图像，这不是一个选项，或者至少我不知道如何实现。谁能给我一个关于它的想法？上传图片时可能会在后台进行图像处理，将其变成圆圈并制作透明背景，但我不知道如何处理？

Answer 1

您可以通过CSS3 border-radius执行此操作，但正如您所提到的，旧IE不支持此属性。

但是PIE.htc（我的例子中的PIE.js）可以在 -

中进行pollyfill

因此 - http://codepen.io/hwg/pen/IBrow。

这使用标准border-radius和复制粘贴的pie.js， 边界半径是图像高度和宽度的50％。

我无法代表演出（请参阅文档），但我认为这可以满足您的需求。

Answer 2

您可以使用所需的背景颜色覆盖在正方形中间具有透明圆圈的PNG图像。然后将其放置在上传的图像上，使其成为一个圆圈的幻觉。