javascript - 将图像转换为圆形

Question

我正在尝试将“方形”图像转换为圆形图像。
图片为 48x48，其边框为正方形。

我想用 HTML/Javascript/CSS 裁剪它，把它变成一个圆圈。

Answer 1

将该图像作为 div 的 background-image，然后将 div 的 border-radius 设置为 50%。就是这么简单。 :)

Fiddle.

div 的 CSS:

div {
    width: 48px;
    height: 48px;
    background: url(your_image_url.your_image_extension);
    border-radius: 50%; /*the magic*/
}