css 如何设置圆形图片

CSS可以通过border-radius属性来设置圆形图片。

img{
    border-radius: 50%;
}

其中50%表示图片的宽或高的一半会被圆角削掉，使图片变为圆形。如果要保证图片比例不变，可以将宽和高都设置为同一个百分比：

img{
    width: 200px;
    height: 200px;
    border-radius: 50%;
}

这样就能保证图片始终是圆形的。

如果要使图片成为椭圆形，只需要将border-radius的两个值设为不同的百分比即可：

img{
    width: 150px;
    height: 200px;
    border-radius: 50% 20%;
}
    

50%表示图片的宽和高都会按照一半的比例被削去，20%表示图片的高将被按照五分之一的比例削去（宽为100%）。

以上就是利用CSS设置圆形图片的方法。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！