本文小编为大家详细介绍“CSS怎么将图片变为圆形”，内容详细，步骤清晰，细节处理妥当，希望这篇“CSS怎么将图片变为圆形”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。

border-radius 属性

border-radius 属性是用来实现圆角技术的，我们上传一张正方形图片后，将它属性值设置为图片尺寸的一半，即可将正方形图片设置为圆形。

具体代码：

<!DOCTYPEhtml><htmllang="en"><head><metacharset="utf-8"><title>CSS设置圆形图片-亿速云(yisu.com)</title><style>#first{height:100px;width:100px;background-color:pink;float:left;}#second{height:100px;width:100px;background-color:red;float:left;margin-left:10px;border-radius:50%;}</style></head><body><divid="first"></div><divid="second"></div></body></html>

如果不清楚图片的尺寸大小，直接将 border-radius 的值设为 50% 即可。

读到这里，这篇“CSS怎么将图片变为圆形”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注亿速云行业资讯频道。