在css中，可以利用border-radius属性来将div设置为正圆形。下面本篇文章就来给大家介绍一下border-radius属性实现正圆形div的方法，希望对大家有所帮助。
border-radius属性可以为元素添加圆角边框，将宽高相同的div元素的border-radius属性值设为50%或100%即可使div元素边框变为圆。
border-radius属性是css3新增属性，在圆角边框出现之前，前端开发有的采用整块的圆角图片作为背景，有的采用小的圆角图片分别放在元素的四角，非常麻烦。
border-radius属性的基本用法：
border-radius 属性是一个简写属性，用于设置四个 border-*-radius 属性；可以为元素添加圆角边框。
border-radius属性可以一次性对四个角设置相同的值，也可以对4个角分别设置圆角样式。而秘诀就在于设定border-radius的参数个数，border-radius的参数个数范围为1~4个。
语法：border-radius: 1-4 length|% / 1-4 length|%;
属性值：length 定义圆角的形状。
% 以百分比定义圆角的形状。
示例：
div {
width: 100px;
height: 100px;
border: 1px solid red;
border-radius: 50%;
background-color: red;
}
只要把div元素的border-radius属性的值设置为50%或100%，就可以得到这样的一个圆形边框。圆形边框可以用在用户的头像展示等等方法。
效果图：
border-radius属性是一个简单又方便且实用的设置边框圆角样式的方法，在前端页面开发的很多地方得到应用；具体的使用方法，要看实际的需要。
更多CSS相关知识，可访问 CSS教程 ！
如果觉得《html实现圆圈 css如何实现正圆形div？》对你有帮助，请点赞、收藏，并留下你的观点哦！
