这篇博客介绍了如何利用CSS的border-radius属性将正方形转变为圆形。通过设置border-radius为正方形边长的50%，可以创建一个半径等于边长一半的圆形。例如，对于一个600px边长的正方形，设置border-radius为300px或50%都将得到一个完美的圆形。同时，博主提到了百分比和em单位的换算，并指出当设置值超过半径限制时，实际效果仍会保持为半径300px的圆。
如何用CSS把正方形变成圆形
border-radius (边框-半径)属性
border-radius可以用 px % em三种单位来设置数值的大小
若正方形的长和宽都为600px则用%表示数值的大小时
border-radius:10%;=60px;
border-radius:30%;=180px;
border-radius:50%;=300px;
若正方形的长和宽都为600px则用em表示数值的大小时.
em一般用来设置字体，较少用来设置border-radius;任意浏览器的默认字体大小为16px；所有未经调整的浏览器都符合1em=16px；
border-radius:5em;=80px;
border-radius:10em;=160px;
border-radius:37.5em;=300px;
若正方形的长和宽都为600px；设置属性分别为：
border-radius:600px;
border-radius:80%;
border-radius:60em;
那么图形是什么样呢？
注：600px>300px;80%>300px;60em>300px;
答案都是300px半径的圆，效果等同于border-radius：300px；
2798
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
