css如何将方形框变为圆形框

CSS如何将方形框变为圆形框？

border-radius: 50%;

在CSS中，可以使用border-radius属性来控制边框的圆角。其中，50%表示圆形边框。

将该属性应用于一个具体的元素：

div {
  width: 100px;
  height: 100px;
  background-color: #555;
  border-radius: 50%;
}

这样就可以将一个原本是方形的div元素变成圆形：

如果想要设置不同的圆角大小，可以使用border-radius属性的四个值来指定。例如，分别控制左上角和右下角的圆角大小：

div {
  width: 100px;
  height: 100px;
  background-color: #555;
  border-radius: 30px 0 0 20px;
}

这样可以得到一个左上角和右下角分别为30px和20px的圆角元素：

CSS中的border-radius属性可以灵活地控制边框的形状，让我们的网页设计更加多元化。