css circle半径

CSS圆形可以通过border-radius属性和固定宽高来实现。border-radius是设置圆角的属性，设置为50%时，矩形就会变成圆形。同时，设置固定宽高相等，就可以让圆形保持一致。代码如下：

.circle {
  border-radius: 50%;
  width: 100px;
  height: 100px;
}

其中，我们可以通过调整width和height的值来改变圆形的大小。以上示例是一个半径为50px的圆形。如果想要创建一个更大或更小的圆形，只需要以此为基础进行调整即可。

除了固定宽高外，我们也可以通过相对宽高或使用百分比来创建可响应式的圆形。例如，下面的代码会创建一个半径为50%的圆形，它的大小将随着它的父元素的大小而变化。

.circle {
  border-radius: 50%;
  width: 50%;
  height: 50%;
}

最后，我们还可以使用CSS伪元素来创建圆形。 ::before 或 ::after 可以被用来实现这一点。以下是一个例子：

.circle::before {
  content: '';
  display: block;
  padding: 50%;
  border-radius: 50%;
  background-color: red;
}

在这个例子中，我们使用了伪元素来创建一个带有50% padding的块。将border-radius属性设置为50%，并填充颜色为红色的背景，就可以创建一个半径为50px的圆形。我们可以通过改变padding值来调整圆形的大小。